<template>
  <div class="go-pageBox">
    <div
      class="fg-commodityQuotationPage"
      :class="[is_autoDetail_expand?'fg-commodityQufixed':'', totalPurchaseAmount>0 ? 'gr-commodityQuotationPage' : '', isScroll?'hideScroll' : '']"
    >
      <!-- 头部区域 -->
      <div :class="['gd-commodityQuotationHead', order_or_price==0 ? 'gd-commodityQuotationprice' : '']">
        <!-- 报价单场合 -->
        <div class="gd-topBox" v-if="order_or_price==0">
          <!-- 报价者 -->
          <div class="gd-merchantInfo">
            <span>{{replierCompany}}</span>
            <div class="spanbox">
              <a v-if="warehouseId>0" :href="build_replierMobile_html()">{{warehouseMobile}}</a>
              <a v-else :href="build_replierMobile_html()">{{replierMobile}}</a>
            </div>
          </div>
        </div>
        <!-- 订单场合 -->
        <div v-if="order_or_price==1">
          <!-- 报价者 -->
          <div class="fg-shopInfo">
            <div>{{replierCompany}} {{!warehouseName||warehouseName.length==0 ? "" : '(' + warehouseName + ')'}}</div>
            <a :href="build_replierMobile_html()">电话</a>
          </div>
          <!-- 询价者 -->
          <div class="fg-consigneeInfo">
            <span v-if="!requesterName">用户 {{requesterMobile}}</span>
            <span v-if="requesterName">{{requesterCompany}} {{requesterMobile}}</span>
            <span v-if="requesterAddress" class="address">地址：{{requesterAddress}}</span>
          </div>
        </div>
        <!-- 车型信息 -->
        <div class="gd-carInfoAndEntrance" id="gd-carInfoAndEntrance" v-if="replyMode==1 || replyMode==2">
          <simpleVinInfo ref="simpleVinInfo" addPadding="true" />
          <div class="gd-entranceBox" v-if="replyMode==1 || replyMode==2">
            <div @click="init_See4sPrice">
              <span>4S店价</span>
            </div>
            <div @click="init_oilconsumption">
              <span>技术参数</span>
            </div>
            <div @click="init_autoMaintenance">
              <span>保养周期</span>
            </div>
          </div>
        </div>
        <div class="gf-quoteRemarksTitle" style="border-bottom:1px solid #ddd" v-if="rfqReplyCode">
          <div class="RemarksBoxs">单号：</div>
          <div class="gf-quoteRemarksMain">
            <div>{{rfqReplyCode}}</div>
          </div>
        </div>
      </div>
      <!-- 领料区域 -->
      <div
        class="hbb-pickingBox"
        v-if="(picking_group.length>0 || pickingCategory_group.length>0 || pickingCommon_group.length>0) && renderMode !== 'error_expired'"
      >
        <div
          class="title"
          v-if="picking_hint=='please_picking' && (picking_group.length>0 || pickingCategory_group.length>0 || pickingCommon_group.length>0)"
        >
          <div class>
            <img src="../assets/images/rfqReplyReader/pic_title.png" />
          </div>
        </div>
        <div
          class="title"
          v-if="picking_hint=='please_ordering' && (picking_group.length>0 || pickingCategory_group.length>0 || pickingCommon_group.length>0)"
        >
          <div class="hb-nopickingBox">
            <div class="hb-nopicking" style>暂无可领料配件，需紧急送货</div>
            <div @click="goParitem" class="hb-goQian">
              <img src="../assets/images/rfqReplyReader/lxia.png" />
              前往
            </div>
          </div>
        </div>
        <!-- 车型配件领料组 -->
        <div class="content" v-if="picking_group.length>0">
          <div class="gs-groupingTitleBox">
            <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
            <div>适用于当前车型</div>
            <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
          </div>
          <div class="fg-detailedListHead fg-detailedListHead1" style>
            <div>
              <div class="fg-cpmmodityInfo" style="width:3.33rem">商品信息</div>
              <div class="fg-cpmmodityNumber">库存</div>
              <div class="fg-cpmmodityPrice">单价</div>
            </div>
          </div>
          <div class="fg-cpmmodityOne" v-for="(item, pickingIndex) in picking_group" :key="pickingIndex">
            <div class="hbb-pickgrounp">
              <!-- 品类名称/参考用量/操作按钮 -->
              <div class="ha-categoryTitle">
                <!-- 左侧品类名称及参考用量的展示 -->
                <div class="ha-leftBox">
                  <div class="ha-categoryTitleText">{{item.groupName}}</div>
                  <template v-if="item.needAutoParam">
                    <!-- 多规格提示 -->
                    <div class="sdw-dosage-hint" v-if="item.needAutoParam && !item.hint_closed">
                      <img class="hint-icon" src="../assets/images/rfqReplyReader/dosage-hint.png" />
                      <div>
                        有多种规格
                        <span>！！！</span>
                        请勾选
                      </div>
                      <img class="hint-close" src="../assets/images/rfqReplyReader/dosage-close.png" @click="on_dosagehint_close(item)" />
                    </div>
                  </template>
                  <template v-else>
                    <!-- 如果无需选规格 而且 只有一个参考用量的话 采用单组渲染模式 -->
                    <div class="ha-referenceDosage" v-if="item.dosages.length == 1 && !item.needAutoParam && item.dosages[0].dosageDesc.length > 0">
                      <img src="../assets/images/rfqReplyReader/arrow_referenceDosage.png" />
                      <div class="ha-textBox">{{item.dosages[0].dosageDesc}}</div>
                    </div>
                  </template>
                </div>
              </div>
              <div v-for="(itd, idtx) in item.dosages" :key="idtx">
                <!-- 如果需要选规格 或者 包含多个参考用量的话 采用多组渲染方案 -->
                <div class="ha-changeName" v-if="item.dosages.length > 1 || item.needAutoParam">
                  <div class="ha-changeNameText">{{itd.dosageDesc}}</div>
                  <img
                    v-if="itd.images.length>0"
                    :src="itd.images[0] + '?x-oss-process=image/resize,m_lfit,h_100,w_100'"
                    @click="previewImages(itd.images)"
                  />
                </div>
                <div class="ddbox" v-for="(it, idx) in itd.partItems" :key="idx" @click="on_partItem_checked_click(it)">
                  <div v-if="it.partItemKind !== 5">
                    <!-- partItemKind:5 代表 无适配商品 -->
                    <div
                      :class="['plxlbox', 'fg-cpmmodityInfo', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                      style="width:3.33rem"
                    >
                      <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                      <div class="gs-brandAndCode" v-if="canViewPickingWareName" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                      <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                    </div>
                    <div class="hb-klBox hb-klBox1">
                      <div class="hb-pickingStockCount">
                        <span>{{it.pickingStockCount}}</span>
                      </div>
                    </div>
                    <div class="hb-klBox hb-klBox2" v-if="it.pickingType!=2">
                      <div class="hb-pickingStockCount">
                        <span v-if="canViewPickingPrice">{{it.price_text}}</span>
                        <span v-if="!canViewPickingPrice">¥*****</span>
                      </div>
                    </div>
                    <div class="hbb-option">
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 2">
                        <img src="../assets/images/rfqReplyReader/button_selectionSpecification.gif" />
                        <div class="ha-buttonText" @click="on_picking_click(1,1,it)">
                          <span>领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_white.png"
                          />
                        </div>
                      </div>
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 3">
                        <div class="ha-buttonText ha-buttonText1" @click="on_picking_click(2,1,it)">
                          <span>已领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_red.png"
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                </div>
              </div>

              <!-- 操作指导图 -->
              <div class="ha-guidePicBox" v-if="item.operateCommand == 'show_image'">
                <div class="ha-guidePicName">操作指导图：</div>
                <div class="skill-sequence-panel-content-wrapper">
                  <div class="skill-sequence-panel-content" scroll-x>
                    <div class="ha-singlePic skill-sequence-skill-wrapper" v-for="(oneImage, index) in item.operateImages" :key="index">
                      <img :src="item.image + '?x-oss-process=image/resize,m_lfit,h_300,w_300'" />
                    </div>
                  </div>
                </div>
              </div>

              <!-- 变速箱油更换 -->
              <div class="ha-guidePicBox-view" v-if="item.operateCommand == 'show_transmission_oil_change'" @click="on_transmission_oil_click">
                <div class="label">变速箱油更换</div>
                <div class="sdw-content">
                  <img class="operateImages" v-if="item.operateImages.length > 0" :src="item.operateImages[0].image" />
                  <div class="seeDetail-view">
                    <div class="seeDetailBtn">查看详情<img class="button_right_arrow" src="../assets/images/rfqReplyReader/button_right_arrow.png" /></div>
                  </div>
                </div>
              </div>

            </div>
          </div>
        </div>
        <!-- 普通配件领料组 -->
        <div class="content" v-if="pickingCategory_group.length>0">
          <div class="title" id="groupingTitle" style="margin-top:.27rem">
            <div class="gs-groupingTitleBox">
              <img src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
              <div>商品清单</div>
              <img src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
            </div>
          </div>
          <div class="content" style="margin-top:0;padding:0" v-if="pickingCategory_group.length>0">
            <div class="fg-detailedListHead fg-detailedListHead1">
              <div>
                <div class="fg-cpmmodityInfo" style="width:3.33rem">商品信息</div>
                <div class="fg-cpmmodityNumber">库存</div>
                <div class="fg-cpmmodityPrice">单价</div>
              </div>
            </div>
            <div
              class="fg-cpmmodityOne"
              style="margin-top:0"
              v-for="(item,pickingCategoryIndex) in pickingCategory_group"
              :key="pickingCategoryIndex"
            >
              <div :class="['hbb-pickgrounp', partsIndex == 0? 'hbb-pickgrounpNone': '']">
                <!-- 品类名称/参考用量/操作按钮 -->
                <div class="ha-categoryTitle">
                  <!-- 左侧品类名称及参考用量的展示 -->
                  <div class="ha-leftBox">
                    <div class="ha-categoryTitleText">{{item.groupName}}</div>
                  </div>
                </div>
                <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx">
                  <div v-if="it.partItemKind !== 5">
                    <!-- partItemKind:5 代表 无适配商品 -->
                    <template v-if="it.pickingType==2">
                      <!-- 原始库存商品 -->
                      <div
                        :class="['plxlbox', 'fg-cpmmodityInfo', it.isLeakStock == 1?'gs-outOfStockBox': '',  order_or_price==1 ?'plxlboxX': '']"
                        style="width:3.33rem"
                      >
                        <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                        <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                      </div>
                    </template>
                    <template v-else>
                      <!-- 云店商品 -->
                      <div
                        :class="['plxlbox', 'fg-cpmmodityInfo', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                        style="width:3.33rem"
                      >
                        <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                        <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                        <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                      </div>
                    </template>
                    <div class="hb-klBox hb-klBox1">
                      <div class="hb-pickingStockCount">
                        <span>{{it.pickingStockCount}}</span>
                      </div>
                    </div>
                    <div class="hb-klBox hb-klBox2" v-if="it.pickingType!=2">
                      <div class="hb-pickingStockCount">
                        <span v-if="canViewPickingPrice">{{it.price_text}}</span>
                        <span v-if="!canViewPickingPrice">¥*****</span>
                      </div>
                    </div>
                    <div class="hbb-option">
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 2">
                        <img src="../assets/images/rfqReplyReader/button_selectionSpecification.gif" />
                        <div class="ha-buttonText" @click="on_picking_click(1,4,it)">
                          <span>领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_white.png"
                          />
                        </div>
                      </div>
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 3">
                        <div class="ha-buttonText ha-buttonText1" @click="on_picking_click(2,4,it)">
                          <span>已领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_red.png"
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 通用件领料组 -->
        <div class="content" v-if="pickingCommon_group.length>0">
          <div class="title" id="groupingTitle" style="margin-top:.27rem">
            <div class="gs-groupingTitleBox">
              <img src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
              <div>通用件商品</div>
              <img src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
            </div>
          </div>
          <div class="hbb-tyButton" v-if="!isOnlyCommonPicking && !isOpenParts" @click="on_parts_extend">
            <div class="hbb-tyButtontxt">
              <img style="width:.4rem;height:.4rem;margin-right:.27rem" src="../assets/images/rfqReplyReader/xia.png" />
              点击展开更多商品
            </div>
          </div>
          <div class="content" style="margin-top:0;padding:0" v-if="isOpenParts">
            <div class="fg-detailedListHead fg-detailedListHead1">
              <div>
                <div class="fg-cpmmodityInfo" style="width:3.33rem">商品信息</div>
                <div class="fg-cpmmodityNumber">库存</div>
                <div class="fg-cpmmodityPrice">单价</div>
              </div>
            </div>
            <div class="fg-cpmmodityOne" style="margin-top:0" v-for="(item, pickingCommonIndex) in pickingCommon_group" :key="pickingCommonIndex">
              <div :class="['hbb-pickgrounp', partsIndex == 0? 'hbb-pickgrounpNone': '']">
                <!-- 品类名称/参考用量/操作按钮 -->
                <div class="ha-categoryTitle">
                  <!-- 左侧品类名称及参考用量的展示 -->
                  <div class="ha-leftBox">
                    <div class="ha-categoryTitleText">{{item.groupName}}</div>
                  </div>
                </div>
                <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx">
                  <div v-if="it.partItemKind !== 5">
                    <!-- partItemKind:5 代表 无适配商品 -->
                    <div
                      v-if="it.canFitAuto"
                      :class="['plxlbox', 'fg-cpmmodityInfo', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                      style="width:3.33rem"
                    >
                      <div class="gs-brandAndCode" style="color: #4084EA;" @click="on_partInfo_click(it)">{{it.brandName}} {{it.partItemName}}</div>
                    </div>
                    <div
                      v-if="!it.canFitAuto"
                      :class="['plxlbox', 'fg-cpmmodityInfo', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                      style="width:3.33rem"
                    >
                      <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                      <b class="gs-brandAndCode" style="color: #4084EA;" @click="on_partInfo_click(it)">{{it.partItemName}}</b>
                    </div>
                    <div class="hb-klBox hb-klBox1">
                      <div class="hb-pickingStockCount">
                        <span>{{it.pickingStockCount}}</span>
                      </div>
                    </div>
                    <div class="hb-klBox hb-klBox2">
                      <div class="hb-pickingStockCount">
                        <span v-if="canViewPickingPrice">{{it.price_text}}</span>
                        <span v-if="!canViewPickingPrice">¥*****</span>
                      </div>
                    </div>
                    <div class="hbb-option">
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 2">
                        <img src="../assets/images/rfqReplyReader/button_selectionSpecification.gif" />
                        <div class="ha-buttonText" @click="on_picking_click(1,3,it)">
                          <span>领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_white.png"
                          />
                        </div>
                      </div>
                      <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 3">
                        <div class="ha-buttonText ha-buttonText1" @click="on_picking_click(2,3,it)">
                          <span>已领料</span>
                          <img
                            style="width:.24rem;height:.24rem;margin-left:0.07rem"
                            src="../assets/images/rfqReplyReader/arrow_rightLink_red.png"
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="Adaptation" v-else>需人工处理</div>
                </div>
              </div>
            </div>
            <div class="hbb-tyButton" v-if="!isOnlyCommonPicking && isOpenParts" @click="on_parts_close">
              <div class="hbb-tyButtontxt hbb-tyButtontxt1">
                <img style="width:.4rem;height:.4rem;margin-right:.27rem" src="../assets/images/rfqReplyReader/shang.png" />
                收起
              </div>
            </div>
          </div>
        </div>
        <!-- 领料记录 -->
        <div
          class="content content1"
          v-if="(picking_group.length>0 || pickingCategory_group.length>0 || pickingCommon_group.length>0) && pickingLogsList.length>0"
        >
          <div class="top">领料记录</div>
          <div class="fg-detailedListHead">
            <div>
              <div class="fg-cpmmodityInfo">商品信息</div>
              <div class="fg-cpmmodityNumber">领料数</div>
              <div class="fg-cpmmodityPrice">单价</div>
            </div>
          </div>
          <div :class="['contentBox', (!isShowAll && pickingLogsListCount>3) ? 'contentHeightMin': 'contentHeightAuto']">
            <div class="list" v-for="(item, logIndex) in pickingLogsList" :key="logIndex">
              <div class="pickingDatah">{{item.createTime_text}}</div>
              <div class="hbb-timeGrounp" v-for="(it, itd) in item.list" :key="itd">
                <div class="cpmmodityInfo">
                  {{it.brandName}}
                  <span @click="on_partInfo_click(it)">{{it.displayPartsNo}}</span>
                  <div v-if="it.canReturn" class="hbb-tui" @click="on_returnCount_click(it)">退 ></div>
                </div>
                <div class="pickingNumber">x{{it.pickingQty}}</div>
                <template v-if="it.replenishmentBillDetailType!=2">
                  <div class="pickingData pickingDataColor" v-if="canViewPickingPrice">¥{{it.itemPrice_text}}</div>
                  <div class="pickingData pickingDataColor" v-if="!canViewPickingPrice">¥*****</div>
                </template>
              </div>
            </div>
          </div>
          <div :class="['hbb-lookAllBox', isShowAll?'hbb-lookAllBoxNone':'']" v-if="pickingLogsListCount>3">
            <div class="hbb-lookAll" @click="on_lookall_record">
              <img
                v-if="!isShowAll"
                style="width:.4rem;height:.4rem;margin-right:.27rem"
                src="../assets/images/rfqReplyReader/arrow_bownRed.png"
              />
              {{record_text}}
            </div>
          </div>
        </div>
        <!-- 关闭按钮 只有无下单区内容时才展示 -->
        <div class="fg-picking-bottomarea" v-if="!has_ordering_items">
          <!-- <div class="fg-picking-bottomarea-closebutton">
            <button @click="on_page_close_click">关 闭</button>
          </div>-->
        </div>
      </div>

      <!-- 下单区域 -->
      <div :class="['hbb-orderingBox', (is_orderingAreaBottom_needFloating || order_or_price==1) ? '': 'hbb-orderingBoxP']" v-if="has_ordering_items">
        <!-- 订单详情 -->
        <div v-if="order_or_price==1" class="hbb-pickingTitle hbb-pickingTitleCenter">
          <div class="text">订单商品列表</div>
          <div class="text1">{{orderStatus_text}}</div>
        </div>
        <!-- 紧急送货 -->
        <div
          v-if="order_or_price==0"
          :class="['hbb-pickingTitle', (picking_group.length>0 || pickingLogsList.length>0) ? '': 'hbb-pickingTitleCenter']"
        >
          <div :class="['text', (picking_group.length>0 || pickingLogsList.length>0) ? '': 'hbb-none']">紧急送货</div>
          <div :class="['fp-checkReminder', (picking_group.length>0 || pickingLogsList.length>0) ? '': 'hbb-headerB']">
            <span class="text001">请勾选</span>
            <span class="text002"></span>
            <span class="text003">您需要的品牌型号</span>
          </div>
        </div>
        <!-- 商品报价清单 -->
        <div class="fg-detailedListBox">
          <div class="fg-detailedListHead">
            <div>
              <div class="fg-cpmmodityInfo">商品信息</div>
              <div class="fg-cpmmodityNumber">数量</div>
              <div class="fg-cpmmodityPrice">单价</div>
            </div>
          </div>
          <!-- 商品内容 -->
          <div class="fg-detailedListSeeBody fp-detailedListSeeBody">
            <!-- 车型配件下单组 -->
            <div class="gs-carAccessoriesBox" v-if="parts_group.length>0">
              <div class="gs-groupingTitleBox">
                <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
                <div>适用于当前车型</div>
                <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
              </div>
              <div class="fg-cpmmodityOne" v-for="(item, partsIndex) in parts_group" :key="partsIndex">
                <div>
                  <!-- 品类名称/参考用量/操作按钮 -->
                  <div class="ha-categoryTitle">
                    <!-- 左侧品类名称及参考用量的展示 -->
                    <div class="ha-leftBox">
                      <div class="ha-categoryTitleText">{{item.groupName}}</div>
                      <template v-if="item.needAutoParam">
                        <!-- 多规格提示 -->
                        <div class="sdw-dosage-hint" v-if="item.needAutoParam && !item.hint_closed">
                          <img class="hint-icon" src="../assets/images/rfqReplyReader/dosage-hint.png" />
                          <div>
                            有多种规格
                            <span>！！！</span>
                            请勾选
                          </div>
                          <img class="hint-close" src="../assets/images/rfqReplyReader/dosage-close.png" @click="on_dosagehint_close(item)" />
                        </div>
                      </template>
                      <template v-else>
                        <!-- 如果无需选规格 而且 只有一个参考用量的话 采用单组渲染模式 -->
                        <div
                          class="ha-referenceDosage"
                          v-if="item.dosages.length == 1 && !item.needAutoParam && item.dosages[0].dosageDesc.length > 0"
                        >
                          <img src="../assets/images/rfqReplyReader/arrow_referenceDosage.png" />
                          <div class="ha-textBox">{{item.dosages[0].dosageDesc}}</div>
                        </div>
                      </template>
                    </div>
                  </div>
                  <div v-for="(itd,idtx) in item.dosages" :key="idtx">
                    <!-- 如果需要选规格 或者 包含多个参考用量的话 采用多组渲染方案 -->
                    <div class="ha-changeName" v-if="item.dosages.length > 1 || item.needAutoParam">
                      <div class="ha-changeNameText">{{itd.dosageDesc}}</div>
                      <img
                        v-if="itd.images.length>0"
                        :src="itd.images[0] + '?x-oss-process=image/resize,m_lfit,h_100,w_100'"
                        @click="previewImages(itd.images)"
                      />
                    </div>
                    <div class="ddbox" v-for="(it,idx) in itd.partItems" :key="idx">
                      <div v-if="it.partItemKind !== 5">
                        <!-- partItemKind:5 代表 无适配商品 pickingOrOrdering:0 代表调货 1：代表领料 特殊场景处理 -->
                        <div v-if="it.pickingOrOrdering == 0" @click="on_partItem_checked_click(it)">
                          <div class="ddboxspan" v-if="order_or_price==0 && it.isLeakStock == 0">
                            <span :class="['fp-choiceBox', it.checked?'fp-choiceSelected':'']"></span>
                          </div>
                          <div
                            v-if="it.canFitAuto"
                            :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                          >
                            <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                            <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                            <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                            <img
                              src="../assets/images/rfqReplyReader/label_redPacket.png"
                              v-if="it.hasRedPacket==1"
                              class="redPacketLabel"
                              @click="on_gift_click(it)"
                            />
                            <img
                              src="../assets/images/rfqReplyReader/Gift.png"
                              v-if="it.hasRedPacket==0 && it.hasGift==1"
                              class="giftimg"
                              @click="on_gift_click(it)"
                            />
                            <div class="gs-otherCode" v-if="it.otherCodes && it.otherCodes.length>0">{{it.otherCodes}}</div>
                          </div>
                          <div
                            v-if="!it.canFitAuto"
                            :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                          >
                            <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                            <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                          </div>
                          <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">缺货</div>
                          <div
                            v-else
                            :class="['fg-numberBox', (order_or_price==0 && it.isLeakStock == 0) ? 'fg-numberBox-clickable' : 'gs-outOfStock']"
                            @click="on_partItem_count_click(it)"
                          >{{it.count}}</div>
                          <div v-if="it.price>0 && canViewPrice" class="fg-priceBox">{{it.price_text}}</div>
                          <div v-else-if="it.price>0 && !canViewPrice" class="fg-priceBox">¥*****</div>
                          <div v-else class="fg-priceBox Adaptation">需人工处理</div>
                        </div>
                        <!-- 极端场景会在调货区出现要领料的商品 -->
                        <div v-if="it.pickingOrOrdering == 1">
                          <div
                            style="width:4.66rem"
                            :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']"
                          >
                            <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                            <div class="gs-brandAndCode" v-if="canViewPickingWareName" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                            <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                          </div>
                          <div class="hb-pickingStockCount hb-pickingStockCount1">
                            (库存:
                            <span>{{it.pickingStockCount}}</span>
                            )
                          </div>
                          <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 2">
                            <img src="../assets/images/rfqReplyReader/button_selectionSpecification.gif" />
                            <div class="ha-buttonText" @click="on_picking_click(1,2,it)">
                              <span>领料</span>
                              <img
                                style="width:.27rem;height:.27rem;margin-left:.08rem"
                                src="../assets/images/rfqReplyReader/arrow_rightLink_white.png"
                              />
                            </div>
                          </div>
                          <div class="ha-rightBox ha-rightBox1" v-if="it.pickingStatus == 3">
                            <div class="ha-buttonText ha-buttonText1" @click="on_picking_click(2,2,it)">
                              <span>已领料</span>
                              <img
                                style="width:.27rem;height:.27rem;margin-left:.08rem"
                                src="../assets/images/rfqReplyReader/arrow_rightLink_red.png"
                              />
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                    </div>
                  </div>
                  <!-- 操作指导图 -->
                  <div class="ha-guidePicBox" v-if="item.operateCommand == 'show_image'">
                    <div class="ha-guidePicName">操作指导图：</div>
                    <div class="skill-sequence-panel-content-wrapper">
                      <div class="skill-sequence-panel-content" scroll-x>
                        <div class="ha-singlePic skill-sequence-skill-wrapper" v-for="(item, index) in item.operateImages" :key="index">
                          <img mode="aspectFit" :src="item.image + '?x-oss-process=image/resize,m_lfit,h_300,w_300'" />
                        </div>
                      </div>
                    </div>
                  </div>

                  <!-- 变速箱油更换 -->
                  <div class="ha-guidePicBox-view" v-if="item.operateCommand == 'show_transmission_oil_change'" @click="on_transmission_oil_click">
                    <div class="label">变速箱油更换</div>
                    <div class="sdw-content">
                      <img class="operateImages" v-if="item.operateImages.length > 0" :src="item.operateImages[0].image" />
                      <div class="seeDetail-view">
                        <div class="seeDetailBtn">查看详情<img class="button_right_arrow" src="../assets/images/rfqReplyReader/button_right_arrow.png" /></div>
                      </div>
                    </div>
                  </div>

                </div>
              </div>
            </div>
            <!-- 普通配件下单组 -->
            <div class="gs-carAccessoriesNoBox" v-if="category_group.length>0">
              <div class="gs-groupingTitleBox">
                <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
                <div>商品清单</div>
                <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
              </div>
              <div class="fg-cpmmodityOne" v-for="(item, index) in category_group" :key="index">
                <div>
                  <div class="dtbox">{{item.groupName}}</div>
                  <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx" @click="on_partItem_checked_click(it)">
                    <!-- partItemKind:5 代表 无适配商品 -->
                    <div v-if="it.partItemKind !== 5">
                      <div class="ddboxspan" v-if="order_or_price==0 && it.isLeakStock == 0">
                        <span :class="['fp-choiceBox', it.checked?'fp-choiceSelected':'']"></span>
                      </div>
                      <div v-if="it.canFitAuto" :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']">
                        <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                        <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                        <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                        <img
                          src="../assets/images/rfqReplyReader/label_redPacket.png"
                          v-if="it.hasRedPacket==1"
                          class="redPacketLabel"
                          @click="on_gift_click(it)"
                        />
                        <img
                          src="../assets/images/rfqReplyReader/Gift.png"
                          v-if="it.hasRedPacket==0 && it.hasGift==1"
                          class="giftimg"
                          @click="on_gift_click(it)"
                        />
                        <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">(缺货)</div>
                        <div class="gs-otherCode" v-if="it.otherCodes && it.otherCodes.length>0">{{it.otherCodes}}</div>
                      </div>
                      <div v-if="!it.canFitAuto">
                        <span>{{it.brandName}} {{it.partItemName}}</span>
                      </div>
                      <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">缺货</div>
                      <div
                        v-else
                        :class="['fg-numberBox', (order_or_price==0 && it.isLeakStock == 0) ? 'fg-numberBox-clickable' : 'gs-outOfStock']"
                        @click="on_partItem_count_click(it)"
                      >{{it.count}}</div>
                      <div v-if="it.price>0 && canViewPrice" class="fg-priceBox">{{it.price_text}}</div>
                      <div v-else-if="it.price>0 && !canViewPrice" class="fg-priceBox">¥******</div>
                      <div v-else class="fg-priceBox Adaptation">需人工处理</div>
                    </div>
                    <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 通用件下单组 -->
            <div class="content" v-if="commonOrdering_group.length>0">
              <!-- 通用件区域 -->
              <div class="title" id="groupingTitle" style="margin-top:.27rem">
                <div class="gs-groupingTitleBox">
                  <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
                  <div>通用件商品</div>
                  <img mode="aspectFit" src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
                </div>
              </div>
              <div class="hbb-tyButton" v-if="commonOrdering_group.length>0 && parts_group.length>0 && !isOpenParts1" @click="on_parts_extend1">
                <div class="hbb-tyButtontxt">
                  <img style="width:.4rem;height:.4rem;margin-right:.27rem" src="../assets/images/rfqReplyReader/xia.png" />
                  点击展开更多商品
                </div>
              </div>
              <div class="content" style="margin-top:0;padding:0" v-if="commonOrdering_group.length>0 && isOpenParts1">
                <div class="fg-cpmmodityOne" v-for="(item, index) in commonOrdering_group" :key="index">
                  <div>
                    <div class="dtbox">{{item.groupName}}</div>
                    <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx" @click="on_partItem_checked_click(it)">
                      <!-- partItemKind:5 代表 无适配商品 -->
                      <div v-if="it.partItemKind !== 5">
                        <div class="ddboxspan" v-if="order_or_price==0 && it.isLeakStock == 0">
                          <span :class="['fp-choiceBox', it.checked?'fp-choiceSelected':'']"></span>
                        </div>
                        <div v-if="it.canFitAuto" :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']">
                          <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                          <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                          <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                          <img
                            src="../assets/images/rfqReplyReader/label_redPacket.png"
                            v-if="it.hasRedPacket==1"
                            class="redPacketLabel"
                            @click="on_gift_click(it)"
                          />
                          <img
                            src="../assets/images/rfqReplyReader/Gift.png"
                            v-if="it.hasRedPacket==0 && it.hasGift==1"
                            class="giftimg"
                            @click="on_gift_click(it)"
                          />
                          <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">(缺货)</div>
                          <div class="gs-otherCode" v-if="it.otherCodes && it.otherCodes.length>0">{{it.otherCodes}}</div>
                        </div>
                        <div v-if="!it.canFitAuto">
                          <span>{{it.brandName}} {{it.partItemName}}</span>
                        </div>
                        <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">缺货</div>
                        <div
                          v-else
                          :class="['fg-numberBox', (order_or_price==0 && it.isLeakStock == 0) ? 'fg-numberBox-clickable' : 'gs-outOfStock']"
                          @click="on_partItem_count_click(it)"
                        >{{it.count}}</div>
                        <div v-if="it.price>0 && canViewPrice" class="fg-priceBox">{{it.price_text}}</div>
                        <div v-else-if="it.price>0 && !canViewPrice" class="fg-priceBox">¥******</div>
                        <div v-else class="fg-priceBox Adaptation">需人工处理</div>
                      </div>
                      <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                    </div>
                  </div>
                </div>
                <div class="hbb-tyButton" v-if="commonOrdering_group.length>0 && parts_group.length>0 && isOpenParts1" @click="on_parts_close1">
                  <div class="hbb-tyButtontxt hbb-tyButtontxt1">
                    <img style="width:.4rem;height:.4rem;margin-right:.27rem" src="../assets/images/rfqReplyReader/shang.png" />
                    收起
                  </div>
                </div>
              </div>
            </div>
            <!-- 自定义商品下单组 -->
            <div class="gs-customizeBox" v-if="free_group.length>0">
              <div class="gs-groupingTitleBox">
                <img src="../assets/images/rfqReplyReader/pic_decorationLeft.png" />
                <div>自定义商品</div>
                <img src="../assets/images/rfqReplyReader/pic_decorationRight.png" />
              </div>
              <div class="fg-cpmmodityOne" v-for="(item,index) in free_group" :key="index">
                <div>
                  <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx" @click="on_partItem_checked_click(it)">
                    <!-- partItemKind:5 代表 无适配商品 -->
                    <div v-if="it.partItemKind !== 5">
                      <div class="ddboxspan" v-if="order_or_price==0 && it.isLeakStock == 0">
                        <span :class="['fp-choiceBox', it.checked?'fp-choiceSelected':'']"></span>
                      </div>
                      <div :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']">
                        <div class="gs-brandAndCode">{{it.partItemName}}</div>
                        <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">(缺货)</div>
                      </div>
                      <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">缺货</div>
                      <div
                        v-else
                        :class="['fg-numberBox', (order_or_price==0 && it.isLeakStock == 0) ? 'fg-numberBox-clickable' : 'gs-outOfStock']"
                        @click="on_partItem_count_click(it)"
                      >{{it.count}}</div>
                      <div v-if="it.price>0 && canViewPrice" class="fg-priceBox">{{it.price_text}}</div>
                      <div v-else-if="it.price>0 && !canViewPrice" class="fg-priceBox">¥*****</div>
                      <div v-else class="fg-priceBox Adaptation">需人工处理</div>
                    </div>
                    <div class="Adaptation Adaptation-red" v-else>需人工处理</div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 赠品下单组 -->
            <div class="gs-giftListBox" v-if="gift_group.length>0">
              <!-- 标题 -->
              <div class="gs-groupingTitleBox">
                <img mode="aspectFit" src="../assets/images/rfqReplyReader/title_gift.png" />
              </div>
              <!-- 单个品类 -->
              <div class="fg-cpmmodityOne" v-for="(item,index) in gift_group" :key="index">
                <div>
                  <div class="dtbox">{{item.groupName}}</div>
                  <div class="ddbox" v-for="(it,idx) in item.partItems" :key="idx">
                    <div :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '']" v-if="it.canFitAuto">
                      <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                      <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                      <div class="gs-labelSeries" v-if="it.seriesName.length>0">{{it.seriesName}}</div>
                      <img
                        src="../assets/images/rfqReplyReader/label_redPacket.png"
                        v-if="it.hasRedPacket==1"
                        class="redPacketLabel"
                        @click="on_gift_click(it)"
                      />
                      <img
                        src="../assets/images/rfqReplyReader/Gift.png"
                        v-if="it.hasRedPacket==0 && it.hasGift==1"
                        class="giftimg"
                        @click="on_gift_click(it)"
                      />
                      <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">(缺货)</div>
                      <div class="gs-otherCode" v-if="it.otherCodes && it.otherCodes.length>0">{{it.otherCodes}}</div>
                    </div>
                    <div v-if="!it.canFitAuto" :class="['plxlbox', it.isLeakStock == 1?'gs-outOfStockBox': '', order_or_price==1 ?'plxlboxX': '']">
                      <div class="gs-brandAndCode gs-brandName">{{it.brandName}}</div>
                      <div class="gs-brandAndCode" @click="on_partInfo_click(it)">{{it.partItemName}}</div>
                    </div>
                    <div v-if="it.isLeakStock == 1" class="gs-outOfStockLabel">缺货</div>
                    <div
                      v-else
                      :class="['fg-numberBox', (order_or_price==0 && it.isLeakStock == 0) ? 'fg-numberBox-clickable' : 'gs-outOfStock']"
                      @click="on_partItem_count_click(it)"
                    >{{it.count}}</div>
                    <div class="fg-priceBox" v-if="canViewPrice">{{it.price_text}}</div>
                    <div class="fg-priceBox" v-else>¥*****</div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 小结 -->
            <div class="fg-commodityQuotationSummary">
              <div>
                共计：
                <span>{{totalCount}}件商品 总价：</span>
                <span class="otherPrice" v-if="canViewPrice">{{totalPrice_text}}</span>
                <span class="otherPrice" v-else>¥******</span>
              </div>
              <div v-if="freightAmount > 0">
                运费：
                <span class="otherPrice" v-if="canViewPrice">¥{{freightAmount}}</span>
                <span class="otherPrice" v-else>¥***</span>
              </div>
              <div v-if="promotionAmount > 0">
                优惠金额：
                <span class="otherPrice" v-if="canViewPrice">-¥{{promotionAmount}}</span>
                <span class="otherPrice" v-else>-¥***</span>
              </div>
              <div>
                应付总金额：
                <span class="allprice otherPrice" v-if="canViewPrice">¥{{totalAmountPayable}}</span>
                <span class="allprice otherPrice" v-else>¥******</span>
              </div>
            </div>
          </div>
        </div>
        <!-- 备注 -->
        <div class="gf-quoteRemarksBox" v-if="remarks">
          <div class="gf-quoteRemarksTitle" v-if="remark">
            <div class="RemarksBoxs">备注：</div>
            <div class="gf-quoteRemarksMain">
              <div>{{remark}}</div>
            </div>
          </div>
        </div>
        <div class="gf-quoteRemarksBox" v-if="orderImages.length>0">
          <div class="hbb-signBox">
            <span class>签收单图片</span>
          </div>
          <div class="hbb-signImgBox">
            <div :class="['img', index % 4==0 ? 'imgNone': '']" v-for="(item,index) in orderImages" :key="index">
              <span @click="delUploadImg(index)">×</span>
              <img :src="item" @click="lookUploadImg(item,index)" />
            </div>
          </div>
        </div>
        <!-- 立即签收 -->
        <div :class="['fg-buttonFool', is_orderingAreaBottom_needFloating ? 'gf-quoteRemarksBoxNoNeed': '']" v-if="order_or_price==1">
          <div class="fg-buttonBox" style="margin-right:.4rem" v-if="canSign">
            <div @click="on_sign_click">确认签收</div>
          </div>
          <div class="fg-buttonBox" style="margin-right:.4rem" v-if="!canSign">
            <div @click="on_upload_click">上传签收单</div>
          </div>
        </div>
        <!-- 确认提交 -->
        <div :class="['fg-buttonFool', is_orderingAreaBottom_needFloating ? 'gf-quoteRemarksBoxNoNeed': '']" v-if="order_or_price==0">
          <div class="fg-buttonBox">
            <img src="../assets/images/rfqReplyReader/rfqreply_confirm.gif" @click="on_save_click" />
          </div>
        </div>
      </div>

      <div class="hbb-otherBox">
        <!-- 已失效场合 -->
        <div class="fg-detailedListInvalid" v-if="renderMode=='error_expired'">
          <img style="width:1.6rem;height:1.6rem" src="../assets/images/rfqReplyReader/shix.png" />
          <span>已失效，无法查看</span>
        </div>
      </div>
    </div>

    <!-- 签收上传弹层 -->
    <div v-if="signupload_dialog_launched">
      <div class="fg-signupload-Pop">
        <div class="fg-signupload-PopBox">
          <!-- 修改数量主体部分 -->
          <div class="fg-signupload-Box">
            <div class="fg-signupload-Title">
              <span>请确保您已收到商品</span>
              <span>是否确认签收?</span>
            </div>
            <div class="fg-signupload-Both" @click="on_signupload_both_confirm_click">确认并上传签收单</div>
            <div class="fg-signupload-OnlySign" @click="on_signupload_onlysign_confirm_click">仅确认签收</div>
          </div>
          <!-- 修改数量按钮部分 -->
          <div class="fg-signupload-Button">
            <div @click="on_signupload_cancel_click">
              <div>
                <span>取 消</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 保养周期组件 -->
    <autoMaintenancePeriodViewer
      ref="autoMaintenancePeriodViewer"
      v-if="showMaintenancecycle"
      :vinCode="vinCode"
      :autoSubId="autoSubId"
      @close="maintenancecycle_close"
    />

    <!-- 赠品信息弹层 -->
    <giftInformation ref="giftInformation" v-if="giftinformation_launched" :input="giftinformation_input" @close="on_giftinformation_close" />

    <!-- 修改数量弹层 -->
    <countModifier
      ref="countModifier"
      v-if="countModifier_launched"
      :input="countModifier_input"
      @cancel="on_countModifier_cancel"
      @confirm="on_countModifier_confirm"
    />
    <!-- 已领取红包弹层 -->
    <receivedRedPacketDialog
      ref="receivedRedPacketDialog"
      v-if="receivedRedPacketDialog_launched"
      :input="receivedRedPacketDialog_input"
      @close="on_receivedRedPacketDialog_close"
    />

    <!-- 点击 "好，送过来"，没有选择商品的弹层 -->
    <lastSureDialog v-if="lastSureDialog_launched" :request_data="lastSureRequest_data" @allchecked="on_all_checked" @close="on_sure_close" />
    <!-- 点击领料的修改数量弹层 -->
    <countpicking
      v-if="countPicking_launched"
      :input="countPicking_input"
      @onepartitem="on_onepartitem_launched"
      @cancel="on_countModifier_cancel"
      @confirm="on_countPickingModifier_confirm"
    />
    <!-- 点击领料记录的退的修改数量弹层 -->
    <returnCountpicking
      v-if="returnCountpicking_launched"
      :input="returnCountpicking_input"
      @onepartitem="on_onepartitem_launched"
      @cancel="on_countModifier_cancel"
      @confirm="on_returnCountModifier_confirm"
    />

    <!-- 变速箱油更换参数弹出层 -->
    <transOilParamSelector
      ref="transOilParamSelector"
      :data="transOilParamSelector_params"
      :vin="vinCode"
      :subid="autoSubId"
      v-if="transOilParamSelector_launched"
      @close="on_transOilParamSelector_close"
    />
  </div>
</template>
<script>
import { mapState, mapGetters } from "vuex";
import { Toast } from 'vant';
import simpleVinInfo from "@/components/simpleVinInfo";
import autoMaintenancePeriodViewer from "@/components/autoMaintenancePeriodViewer";
import foursShopPriceViewer from "@/components/foursShopPriceViewer";
import countModifier from "@/components/countModifier";
import giftInformation from "@/components/giftInformation";
import receivedRedPacketDialog from "@/components/receivedRedPacketDialog";
import selectionParameterDialog from "@/components/selectionParameterDialog";
import lastSureDialog from "@/components/lastSureDialog";
import countpicking from "@/components/countpicking";
import returnCountpicking from "@/components/returnCountpicking";
import transOilParamSelector from "@/components/transOilParamSelector";

export default {
  name: "rfqReplyReader",
  components: {
    simpleVinInfo,
    autoMaintenancePeriodViewer,
    foursShopPriceViewer,
    countModifier,
    giftInformation,
    receivedRedPacketDialog,
    selectionParameterDialog,
    lastSureDialog,
    countpicking,
    returnCountpicking,
    transOilParamSelector
  },
  props: {},
  created() {
    this.query_rfqReplyIdTicket = this.$com_util.getQueryString("idt") || "";
    this.query_rfqReplyId = this.$com_util.getQueryString("id") || 0;
    this.initPage();
  },
  mounted() {},
  data() {
    return {
      query_rfqReplyIdTicket: "", //报价单ID的加密票据
      query_rfqReplyId: 0, //报价单ID

      scrolltop: 0,

      replyMode: 0, //报价单模式 0:通用报价 1:VIN码报价 2:车型报价
      vinCode: "", //VIN码
      autoSubId: 0, //车型ID

      renderMode: "", //渲染模式
      order_or_price: 0, //订单or报价单 0:报价单 1:订单

      operateSource: 0, //报价单来源类型 0,1,2:人工报价 3:机器人客户群报价 4:机器人内部群报价

      replierName: "", //报价者名称
      replierCompany: "", //报价者公司
      replierMobile: "", //报价者电话

      requesterName: "", //询价者名称
      requesterMobile: "", //询价者电话
      requesterCompany: "", //询价者公司
      requesterAddress: "", //询价者地址

      warehouseName: "", // 仓库名称
      warehouseMobile: "", // 仓库电话

      //领料区
      picking_group: [], //车型配件领料组
      pickingCategory_group: [], // 普通配件领料组
      pickingCommon_group: [], //通用件领料组
      pickingLogsList: [], // 领料记录
      is_pickingAreaBottom_needFloating: false, // 判断下单区底部是否需要浮动

      //下单区
      parts_group: [], //车型配件下单组
      category_group: [], //普通配件下单组
      commonOrdering_group: [], //通用件下单组
      free_group: [], //自由商品下单组
      gift_group: [], //赠品下单组
      has_ordering_items: false, //是否有下单区内容
      is_orderingAreaBottom_needFloating: false, // 判断下单区底部是否需要浮动

      remark: "", //报价单内的备注
      rfqReplyCode: "", //报价单编号

      totalCount: 0, // 商品总数
      totalPrice: 0, // 商品总价
      totalPrice_text: "", //商品总价文案

      promotions: [], //促销活动

      canViewDetail: true, // 可否查看车型详情
      is_autoDetail_expand: false, //车型详情是否展开中
      carInfoData: null, //车型信息
      autoDetails: [], //车型详情
      autoText: "", //车型文案

      showSee4sPrice: false, //默认不初始化4s店价格查看组件
      showMaintenancecycle: false, //默认不初始化保养周期组件
      showOilconsumption: false, //默认不初始技术参数组件
      Rescreening: null,

      giftinformation_launched: false,
      giftinformation_input: {},
      cloudShopId: 0, //店铺id

      isConfirmInfo: false, //默认已经完善信息了
      requesterAddress_forEdit: "", //编辑用公司地址
      requesterCompany_forEdit: "", //编辑用公司名称

      luckyRedPacket_hint_launched: false, //手气红包提示弹层

      countModifier_launched: false, //数量修改弹层 是否启动
      countModifier_currentItem: null, //数量修改弹层 当前商品
      countModifier_input: null, //数量修改弹层 入参

      receivedRedPacketDialog_launched: false, //已领取红包弹层 是否启动
      receivedRedPacketDialog_input: null, //已领取红包弹层 入参

      totalPurchaseAmount: 0, //总采购额
      totalPurchaseAmount_text: "", //总采购额
      totalPurchaseAmount_title: "", // 已采购金额标题

      warehouseId: "",
      isScroll: false, // 页面是否可以滚动

      orderStatus_text: "", //订单状态文案
      freightAmount: 0, // 运费
      promotionAmount: 0, // 优惠金额
      totalAmountPayable: 0, // 应付总金额

      bigImgSwiper_launched: false, // 查看大图弹层组件 是否启动
      bigImg_Obj: {}, // 查看

      userRobot_key: [], // 记录用户选中的参数的规格 方便多次选择

      lastSureDialog_launched: false, // 点击 "好，送过来"，没有选择商品的弹层 是否启动
      lastSureRequest_data: {}, // 点击 "好，送过来"，没有选择商品的弹层 入参

      canViewPrice: false, //能否查看价格
      canViewPickingPrice: false, //能否查看领料价格
      canViewPickingWareName: false, //能否查看领料商品名称
      canSign: false, //能否签收

      countPicking_launched: false, // 选择领料数量的弹层是否启动
      countPicking_input: null, // 启动领料弹层的入参 紧急送货部分
      pickingBigBoxHeight: 0, // 紧急送货的dom的高度 【用于做底部按钮的交互效果】
      pickingBigBoxScrollTop: 0, // 紧急送货距离页面顶部的实际高度
      otherBoxScrollTop: 0, //其他的dom的高度 【用于做底部按钮的交互效果】
      otherBoxHeight: 0, // 其他的dom的高度 【用于做底部按钮的交互效果】
      chaVal: 300, // 取得第一条展示数据的到父元素的实际高度
      isShowAll: false, // 是否展示所有的领料记录
      record_text: "点击展开全部", // 是否展示所有的领料记录 切换所对应的文案

      returnCountpicking_launched: false, //点击领料记录的退货的弹层是否启动
      returnCountpicking_input: null, // 点击领料记录的退货的弹层的入参

      isOpenParts: false, // 是否展开通用件部分 【领料区】
      isOpenParts1: false, // 是否展开通用件部分 【送货区】
      isOnlyCommonPicking: false, // 是否只有通用件领料

      picking_hint: "", // please_picking: 展示请领料 please_ordering：展示前往按钮去调货区
      orderImages: [], // 上传的签收图片 用于展示用

      pickingLogsListCount: 0, // 如果领料记录得总数大于3跳的话展示展开的按钮
      current_image_length: 0, // 判断用户当前选择了多少张签收图片

      signupload_dialog_launched: false, //签收上传确认弹层是否启动

      transOilParamSelector_params: [], //变速箱油参数集合
      transOilParamSelector_launched: false, // 变速箱油的多规格选择弹层是否启动
    };
  },
  computed: {
    ...mapState({
      // 获取个人信息
      myInfo: (state) => {
        return state.user.myInfo;
      },
    }),
    ...mapGetters(["imGroupCode"]),
  },
  methods: {
    initPage() {
      this.GetRfqReply();
      this.GetRfqReply_ValidShopPromotions();
      this.GetTotalPurchaseAmount();
      this.GetRfqReplenishmentPickingLogs();
    },

    on_partItem_checked_click(item) {
      if (this.order_or_price == 1) return;
      if (item.isLeakStock) return;

      // console.log(item)
      //item.checked = !item.checked;
      item.checked = !item.checked;
      //  console.log(item.checked)
      // console.log(item)
      //console.log(item.checked)
      //车型配件下单组
      // for (var i = 0; i < this.parts_group.length; i++) {
      //   for (var j = 0; j < this.parts_group[i].dosages.length; j++) {
      //     for (var k = 0; k < this.parts_group[i].dosages[j].partItems.length; k++) {
      //       if (item.rfqReplyDetailId == this.parts_group[i].dosages[j].partItems[k].rfqReplyDetailId) {
      //         this.parts_group[i].dosages[j].partItems[k].checked = !this.parts_group[i].dosages[j].partItems[k].checked;
      //         console.log(!this.parts_group[i].dosages[j].partItems[k].checked)
      //         console.log(this.parts_group[i].dosages[j].partItems[k].checked)
      //         console.log("---1---")
      //       }
      //     }
      //   }
      // }
      // this.parts_group = this.parts_group;

      // //普通配件下单组
      // for (var i = 0; i < this.category_group.length; i++) {
      //   for (var j = 0; j < this.category_group[i].partItems.length; j++) {
      //     if (item.rfqReplyDetailId == this.category_group[i].partItems[j].rfqReplyDetailId) {
      //       this.category_group[i].partItems[j].checked = !this.category_group[i].partItems[j].checked;
      //     }
      //   }
      // }
      // this.category_group = this.category_group;

      // //通用件下单组
      // for (var i = 0; i < this.commonOrdering_group.length; i++) {
      //   for (var j = 0; j < this.commonOrdering_group[i].partItems.length; j++) {
      //     if (item.rfqReplyDetailId == this.commonOrdering_group[i].partItems[j].rfqReplyDetailId) {
      //       this.commonOrdering_group[i].partItems[j].checked = !this.commonOrdering_group[i].partItems[j].checked;
      //     }
      //   }
      // }
      // this.commonOrdering_group = this.commonOrdering_group;

      // //自由商品下单组
      // for (var i = 0; i < this.free_group.length; i++) {
      //   for (var j = 0; j < this.free_group[i].partItems.length; j++) {
      //     if (item.rfqReplyDetailId == this.free_group[i].partItems[j].rfqReplyDetailId) {
      //       this.free_group[i].partItems[j].checked = !this.free_group[i].partItems[j].checked;
      //     }
      //   }
      // }
      // this.free_group = this.free_group;

      //计算小结
      this.caculateSummary();
    },

    //关闭技术参数组件
    oilconsumption_close() {
      this.showOilconsumption = false;
    },
    //初始化技术参数组件
    init_oilconsumption() {
      this.showOilconsumption = true;
    },
    //初始化保养周期组件
    init_autoMaintenance() {
      this.showMaintenancecycle = true;
    },
    //关闭保养周期组件
    maintenancecycle_close() {
      this.showMaintenancecycle = false;
    },
    //初始化4s店价格组件
    init_See4sPrice() {
      this.showSee4sPrice = true;
    },
    //关闭4s店价格组件
    see4sprice_close() {
      this.showSee4sPrice = false;
    },
    // 启动商品详情弹层
    on_partInfo_click(oneItem) {
      event.stopPropagation(); //阻止穿透
      //伪代码
      //跳转商品页面
    },

    //取得报价单
    GetRfqReply() {
      var _this = this;
      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/GetRfqReply_V4",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId,
          imUserCode: _this.myInfo.userID
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          _this.replyMode = res.Body.replyMode;
          _this.warehouseId = res.Body.warehouseId;

          if (res.Body.replyMode == 1) {
            _this.vinCode = res.Body.replyKey;
          } else if (res.Body.replyMode == 2) {
            _this.autoSubId = res.Body.replyKey;
          }

          _this.renderMode = res.Body.renderMode || "";
          _this.operateSource = res.Body.operateSource || 0;
          _this.replierName = res.Body.replierName || "";
          _this.replierCompany = res.Body.replierCompany || "";
          _this.replierMobile = res.Body.replierMobile || "";

          if (_this.renderMode.indexOf("order") > -1) {
            _this.order_or_price = 1;
            _this.setTitle("订单");
          } else {
            _this.order_or_price = 0;
            _this.setTitle(_this.replierCompany + "报价单");
          }
          // 判断是否有下单区内容
          var emtryArr = [];
          if (res.Body.parts_group.length > 0) emtryArr.push("1");
          if (res.Body.category_group.length > 0) emtryArr.push("2");
          if (res.Body.free_group.length > 0) emtryArr.push("3");
          if (res.Body.gift_group.length > 0) emtryArr.push("4");
          if (res.Body.commonOrdering_group.length > 0) emtryArr.push("5");
          if (emtryArr.length > 0) {
            _this.has_ordering_items = true;
          } else {
            _this.has_ordering_items = false;
          }
          if (res.Body.parts_group) {
            res.Body.parts_group.forEach(x => {
              x.dosages.forEach(y => {
                y.partItems.forEach(e => {
                  e.totalPriceOne_text = _this.formatCurrency(
                    e.price * e.count
                  );
                  e.partItemName_text = _this.secretString(
                    e.partItemName,
                    "middle"
                  );
                });
              });
            });
          }
          if (res.Body.category_group) {
            res.Body.category_group.forEach(x => {
              x.partItems.forEach(e => {
                e.totalPriceOne_text = _this.formatCurrency(e.price * e.count);
              });
            });
          }
          if (res.Body.commonOrdering_group) {
            res.Body.commonOrdering_group.forEach(x => {
              x.partItems.forEach(e => {
                e.totalPriceOne_text = _this.formatCurrency(e.price * e.count);
              });
            });
          }

          if (res.Body.free_group) {
            res.Body.free_group.forEach(x => {
              x.partItems.forEach(e => {
                e.totalPriceOne_text = _this.formatCurrency(e.price * e.count);
              });
            });
          }
          if (res.Body.gift_group) {
            res.Body.gift_group.forEach(x => {
              x.partItems.forEach(e => {
                e.totalPriceOne_text = _this.formatCurrency(e.price * e.count);
              });
            });
          }
          if (res.Body.picking_group) {
            res.Body.picking_group.forEach(x => {
              x.dosages.forEach(y => {
                y.partItems.forEach(e => {
                  e.partItemName_text = _this.secretString(
                    e.partItemName,
                    "middle"
                  );
                });
              });
            });
          }

          _this.requesterName = res.Body.requesterName || "";
          _this.requesterCompany = res.Body.requesterCompany || "";
          _this.requesterMobile = res.Body.requesterMobile || "";
          _this.requesterAddress = res.Body.requesterAddress || "";
          _this.warehouseName = res.Body.warehouseName || "";
          _this.warehouseMobile = res.Body.warehouseMobile || "";

          //领料区
          _this.picking_group = res.Body.picking_group || [];
          _this.pickingCommon_group = res.Body.pickingCommon_group || [];
          _this.pickingCategory_group = res.Body.pickingCategory_group || [];

          //下单区
          _this.parts_group = res.Body.parts_group || [];
          _this.category_group = res.Body.category_group || [];
          _this.free_group = res.Body.free_group || [];
          _this.gift_group = res.Body.gift_group || [];
          _this.commonOrdering_group = res.Body.commonOrdering_group || [];

          _this.rfqReplyCode = res.Body.rfqReplyCode || "";
          _this.remark = res.Body.remark || "";
          _this.freightAmount = _this.formatCurrency(
            res.Body.freightAmount || 0
          );
          _this.promotionAmount = _this.formatCurrency(
            res.Body.promotionAmount || 0
          );
          _this.orderStatus_text = res.Body.orderStatus_text || "";

          _this.cloudShopId = res.Body.cloudShopId || 0;
          _this.isConfirmInfo = res.Body.isConfirmInfo || false;
          _this.requesterCompany_forEdit = res.Body.requesterCompany || "";
          _this.requesterAddress_forEdit = res.Body.requesterAddress || "";

          _this.luckyRedPacket_hint_launched =
            res.Body.canReceiveLuckyRedPacket || false;

          _this.canViewPrice = res.Body.canViewPrice;
          _this.canViewPickingPrice = res.Body.canViewPickingPrice;
          _this.canViewPickingWareName = res.Body.canViewPickingWareName;
          _this.canSign = res.Body.canSign;

          _this.isOpenParts =
            res.Body.picking_group.length > 0 ||
            res.Body.pickingCategory_group.length > 0 ||
            res.Body.parts_group.length > 0 ||
            res.Body.category_group.length > 0 ||
            res.Body.free_group.length > 0 ||
            res.Body.gift_group.length > 0 ||
            res.Body.commonOrdering_group.length > 0
              ? false
              : true;
          _this.isOnlyCommonPicking =
            res.Body.pickingCommon_group.length > 0 &&
            res.Body.picking_group.length == 0 &&
            res.Body.pickingCategory_group.length == 0 &&
            res.Body.parts_group.length == 0 &&
            res.Body.category_group.length == 0 &&
            res.Body.free_group.length == 0 &&
            res.Body.gift_group.length == 0 &&
            res.Body.commonOrdering_group.length == 0;
          _this.isOpenParts1 = res.Body.parts_group.length > 0 ? false : true;
          _this.picking_hint = res.Body.picking_hint || "";
          _this.orderImages = res.Body.orderImages || [];

          //计算小结
          _this.caculateSummary();

          _this.$nextTick(() => {
            //VIN码模式or车型模式时需要取得车型信息
            if (res.Body.replyMode == 1 || res.Body.replyMode == 2) {
              //VIN码报价 和 车型报价 需要激活简单VIN码展示组件
              _this.$refs.simpleVinInfo.active({
                vinCode: res.Body.replyMode == 1 ? res.Body.replyKey : "",
                autoSubId:
                  res.Body.replyMode == 2 ? Number(res.Body.replyKey) : 0,
                vinEncrypt: false,
                canViewDetail: true
              });
            }
          });
        }
      });
    },

    //获取促销活动
    GetRfqReply_ValidShopPromotions() {
      var _this = this;
      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/GetRfqReply_ValidShopPromotions",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          _this.promotions = res.Body || [];
        }
      });
    },

    on_gift_click(item) {
      this.giftinformation_input = {
        cloudShopId: this.cloudShopId,
        partItemId: item.partItemId
      };
      this.giftinformation_launched = true;
    },

    //取得客户对店铺的总采购金额
    GetTotalPurchaseAmount() {
      var _this = this;
      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/GetTotalPurchaseAmount",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          _this.totalPurchaseAmount = res.Body.totalPurchaseAmount || 0;
          _this.totalPurchaseAmount_text = _this.formatCurrency(
            res.Body.totalPurchaseAmount || 0
          );
          _this.totalPurchaseAmount_title = res.Body.notice_title;
        }
      });
    },

    // 构造报价者打电话标签
    build_replierMobile_html() {
      return "tel:" + this.replierMobile;
    },

    //确认发货
    on_save_click() {
      //关闭手气红包领取提示弹层
      var _this = this;
      var partsId_Arr = []; // 根据partsId_Arr的长度取判断是否用户是否可以点击送货  0：则代表满足条件可以送货
      this.luckyRedPacket_hint_launched = false;

      this.parts_group.forEach(x => {
        if (x.needAutoParam && x.dosages.length == 0) {
          partsId_Arr.push(x.groupId);
        }
      });
      if (partsId_Arr.length > 0) {
        this.isScroll = true;
        this.lastSureDialog_launched = true;
        this.lastSureRequest_data = {
          rfqReplyIdTicket: this.query_rfqReplyIdTicket,
          rfqReplyId: this.query_rfqReplyId,
          partsIds: partsId_Arr
        };
        return false;
      }
      var choice = this.buildChoiceDetails();
      // 之前文案  至少勾选1个需供货商发货的商品
      if (choice.length == 0) {
        MessageBox.alert("至少勾选1个需供货商发货的商品");
        return;
      }

      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/ConfirmRfqReply_V3",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: this.query_rfqReplyIdTicket,
          rfqReplyId: this.query_rfqReplyId,
          choiceDetails: choice
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }

          if (res.Body.messageTips !== "") {
            setTimeout(() => {
              Toast(res.Body.messageTips);
            }, 0);
            // 强制小程序页面重载
            setTimeout(function() {
              _this.GetRfqReply();
            }, 3000);
            return;
          }
          if (res.Body.hasRedPacket) {
            //有红包
            _this.receivedRedPacketDialog_input = {
              amount_text: res.Body.redPacketAmount_text,
              redPacketHintType: res.Body.redPacketHintType,
              currentTime: res.Body.redPacketCurrentTime,
              endTime: res.Body.redPacketEndTime
            };
            _this.receivedRedPacketDialog_launched = true;
          } else {
            //无红包
            Toast("已提醒商家发货");
            // 强制小程序页面重载
            setTimeout(function() {
              _this.GetRfqReply();
            }, 3000);
          }
        }
      });
    },

    buildChoiceDetails() {
      var choice = [];

      //车型配件下单组
      for (var i = 0; i < this.parts_group.length; i++) {
        for (var j = 0; j < this.parts_group[i].dosages.length; j++) {
          for (
            var k = 0;
            k < this.parts_group[i].dosages[j].partItems.length;
            k++
          ) {
            if (this.parts_group[i].dosages[j].partItems[k].checked) {
              choice.push({
                rfqReplyDetailId: this.parts_group[i].dosages[j].partItems[k]
                  .rfqReplyDetailId,
                count: this.parts_group[i].dosages[j].partItems[k].count
              });
            }
          }
        }
      }

      //普通配件下单组
      for (var i = 0; i < this.category_group.length; i++) {
        for (var j = 0; j < this.category_group[i].partItems.length; j++) {
          if (this.category_group[i].partItems[j].checked) {
            choice.push({
              rfqReplyDetailId: this.category_group[i].partItems[j]
                .rfqReplyDetailId,
              count: this.category_group[i].partItems[j].count
            });
          }
        }
      }

      //通用件下单组
      for (var i = 0; i < this.commonOrdering_group.length; i++) {
        for (
          var j = 0;
          j < this.commonOrdering_group[i].partItems.length;
          j++
        ) {
          if (this.commonOrdering_group[i].partItems[j].checked) {
            choice.push({
              rfqReplyDetailId: this.commonOrdering_group[i].partItems[j]
                .rfqReplyDetailId,
              count: this.commonOrdering_group[i].partItems[j].count
            });
          }
        }
      }

      //自由商品下单组
      for (var i = 0; i < this.free_group.length; i++) {
        for (var j = 0; j < this.free_group[i].partItems.length; j++) {
          if (this.free_group[i].partItems[j].checked) {
            choice.push({
              rfqReplyDetailId: this.free_group[i].partItems[j]
                .rfqReplyDetailId,
              count: this.free_group[i].partItems[j].count
            });
          }
        }
      }

      return choice;
    },
    //点击跳转去活动页面
    on_promotion_click(promotion) {
      var target_url =
        window.location.protocol +
        "//" +
        window.location.host +
        "/appActivities/singlePromotion101.html?promotionId=" +
        promotion.promotionId +
        "&openid=" +
        this.query_openId;

      if (target_url.length == 0) return;

      location.href = target_url;
    },

    on_giftinformation_close() {
      this.giftinformation_launched = false;
    },

    on_partItem_count_click(oneItem) {
      event.stopPropagation(); //阻止穿透

      if (oneItem.isLeakStock == 1) return;
      if (this.order_or_price == 1) return;

      if (oneItem.isGift == 1) {
        Toast("赠品不能修改数量");
        return;
      }

      this.countModifier_input = {
        count: oneItem.count,
        price: oneItem.price
      };
      this.countModifier_currentItem = oneItem;
      this.countModifier_launched = true;
    },

    on_countModifier_cancel() {
      this.countModifier_launched = false;
      this.countPicking_launched = false;
      this.returnCountpicking_launched = false;
    },

    //计算小结
    caculateSummary() {
      let totalCount = 0;
      let totalPrice = 0;

      var target_group = [
        this.category_group,
        this.commonOrdering_group,
        this.free_group,
        this.gift_group
      ];

      target_group.forEach(oneGroup => {
        for (var i = 0; i < oneGroup.length; i++) {
          for (var j = 0; j < oneGroup[i].partItems.length; j++) {
            if (oneGroup[i].partItems[j].checked) {
              totalCount += oneGroup[i].partItems[j].count;
              totalPrice +=
                oneGroup[i].partItems[j].price * oneGroup[i].partItems[j].count;
            }
          }
        }
      });

      this.parts_group.forEach(o => {
        o.dosages.forEach(n => {
          n.partItems.forEach(e => {
            if (e.checked) {
              totalCount += e.count;
              totalPrice += e.price * e.count;
            }
          });
        });
      });
      this.totalCount = totalCount;
      this.totalPrice = totalPrice;
      this.totalAmountPayable = (
        totalPrice +
        Number(this.freightAmount) -
        Number(this.promotionAmount)
      ).toFixed(2);
      this.totalPrice_text = "¥" + totalPrice.toFixed(2).toString();
    },

    on_countModifier_confirm(e) {
      let item = this.countModifier_currentItem;
      let count_result = e.count;
      let totalPriceOne_result = e.totalPriceOne_text;

      this.countModifier_launched = false;

      //车型配件下单组
      for (var i = 0; i < this.parts_group.length; i++) {
        for (var j = 0; j < this.parts_group[i].dosages.length; j++) {
          for (
            var k = 0;
            k < this.parts_group[i].dosages[j].partItems.length;
            k++
          ) {
            if (
              item.rfqReplyDetailId ==
              this.parts_group[i].dosages[j].partItems[k].rfqReplyDetailId
            ) {
              this.parts_group[i].dosages[j].partItems[k].count = count_result;
              this.parts_group[i].dosages[j].partItems[
                k
              ].totalPriceOne_text = totalPriceOne_result;
            }
          }
        }
      }
      this.parts_group = this.parts_group;

      //普通配件下单组
      for (var i = 0; i < this.category_group.length; i++) {
        for (var j = 0; j < this.category_group[i].partItems.length; j++) {
          if (
            item.rfqReplyDetailId ==
            this.category_group[i].partItems[j].rfqReplyDetailId
          ) {
            this.category_group[i].partItems[j].count = count_result;
            this.category_group[i].partItems[
              j
            ].totalPriceOne_text = totalPriceOne_result;
          }
        }
      }
      this.category_group = this.category_group;

      //通用件下单组
      for (var i = 0; i < this.commonOrdering_group.length; i++) {
        for (
          var j = 0;
          j < this.commonOrdering_group[i].partItems.length;
          j++
        ) {
          if (
            item.rfqReplyDetailId ==
            this.commonOrdering_group[i].partItems[j].rfqReplyDetailId
          ) {
            this.commonOrdering_group[i].partItems[j].count = count_result;
            this.commonOrdering_group[i].partItems[
              j
            ].totalPriceOne_text = totalPriceOne_result;
          }
        }
      }
      this.commonOrdering_group = this.commonOrdering_group;

      //自由商品下单组
      for (var i = 0; i < this.free_group.length; i++) {
        for (var j = 0; j < this.free_group[i].partItems.length; j++) {
          if (
            item.rfqReplyDetailId ==
            this.free_group[i].partItems[j].rfqReplyDetailId
          ) {
            this.free_group[i].partItems[j].count = count_result;
            this.free_group[i].partItems[
              j
            ].totalPriceOne_text = totalPriceOne_result;
          }
        }
      }
      this.free_group = this.free_group;

      //计算小结
      this.caculateSummary();
    },

    on_receivedRedPacketDialog_close() {
      this.receivedRedPacketDialog_launched = false;
      // 强制小程序页面重载
      this.GetRfqReply();
    },
    // 看大图 支持轮播
    previewImages(urls) {
      // wx.previewImage({
      //   urls: urls
      // });
    },
    on_dosagehint_close(oneGroup) {
      oneGroup.hint_closed = true;
    },

    sureSelectFn(arr, responseData) {
      // 处理不同区域的选规格之后的数据源 领料区和调货区
      arr = arr.map(
        item =>
          item.groupId === responseData.partItemObj.Body.groupId
            ? responseData.partItemObj.Body
            : item
      );
      return arr;
    },
    // 点击 "好，送过来"，没有选择商品的弹层 关闭
    on_sure_close() {
      this.lastSureDialog_launched = false;
      this.isScroll = false;
    },
    // "好，送过来" 弹层内全部送过来的按钮
    on_all_checked(responseData) {
      this.parts_group.forEach(x => {
        responseData.Body.forEach(y => {
          if (x.groupId === y.groupId) {
            this.parts_group = this.parts_group.map(
              item => (item.groupId === y.groupId ? y : item)
            );
          }
        });
      });
      this.parts_group = this.parts_group;
      this.lastSureDialog_launched = false;
      this.isScroll = false;
      //计算小结
      this.caculateSummary();
      // 执行 “好，送过来” 的相关操作
      this.on_save_click();
    },

    // 格式化日期
    getNewDate(time, mode) {
      // 重新优化选择的事件的格式 mode:1:只取月日 2：取年月日
      var timestamp = Date.parse(time);
      var date = new Date(timestamp);
      //获取年份
      var Y = date.getFullYear();
      //获取月份
      var M =
        date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1;
      //获取当日日期
      var D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      //获取小时
      var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      //获取分钟
      var minute =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      //获取秒
      var second =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      var nowTime;
      if (mode == 1) {
        return (nowTime = Y + "-" + M + "-" + D);
      } else if (mode == 2) {
        return Y + "年" + M + "月" + D + "日";
      } else {
        return (
          Y +
          "年" +
          M +
          "月" +
          D +
          "日" +
          " " +
          hour +
          ":" +
          minute +
          ":" +
          second
        );
      }
    },

    //金额格式
    formatCurrency(input) {
      return input.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, "$&");
    },
    GetRfqReplenishmentPickingLogs() {
      // 取得报价单内的领料记录
      var _this = this;
      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/GetRfqReplenishmentPickingLogs_V2",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          if (res.Body.days) {
            res.Body.days.forEach(y => {
              y.createTime_text = _this.getNewDate(y.oneDay, 1);
              y.list.forEach(z => {
                z.itemPrice_text = _this.formatCurrency(z.itemPrice);
              });
            });
          }
          _this.pickingLogsList = res.Body.days;
          _this.pickingLogsListCount = res.Body.totalCount;
        }
      });
    },
    // 点击我要领料按钮 选择领料数量
    on_picking_click(currentMode, selectArea, oneItem) {
      // countPicking_input是领料弹层的入参 商品ID 领用数量
      // currentMode 1：我要领料 2：继续领料
      // 只在我要领料的时候进行判断客户是否可以领料
      // 启动弹层的入参以及条件
      var _this = this;
      var requestData = {
        oneItem: oneItem,
        selectArea: selectArea,
        currentMode: currentMode
      };
      if (currentMode == 1) {
        this.verifyPicking().then(res => {
          if (!res.canPickingWare) {
            Toast("您当前可用余额不足，需先充值才可领料");
            return false;
          }
          _this.setlaunchedParams(requestData);
        });
      } else {
        _this.setlaunchedParams(requestData);
      }
    },
    setlaunchedParams(requestData) {
      // 设置启动领料弹层的入参 【业务需求：领料需要判断 继续领料不需要】
      this.countPicking_input = {
        count: requestData.oneItem.count,
        price: this.formatCurrency(requestData.oneItem.price),
        brandName: requestData.oneItem.brandName,
        pickingStockCount: requestData.oneItem.pickingStockCount,
        partItemName: requestData.oneItem.partItemName,
        pickingStoreHouse: requestData.oneItem.pickingStoreHouse,
        partItemId: requestData.oneItem.partItemId,
        mode: requestData.currentMode,
        rfqReplyIdTicket: this.query_rfqReplyIdTicket,
        rfqReplyId: this.query_rfqReplyId,
        selectArea: requestData.selectArea,
        pickingType: requestData.oneItem.pickingType
      };
      this.countPicking_launched = true;
    },
    verifyPicking() {
      // 验证是否可以进行领料操作
      var _this = this;
      var myPromise = new Promise(function(resolve) {
        _this.ajax({
          method: "POST",
          url: resourceUrl + "/Rfq/RfqCanPickingWare",
          dataType: "JSON",
          data: {
            rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
            rfqReplyId: _this.query_rfqReplyId
          },
          success: res => {
            if (res.Header.ErrorCode != 0) {
              Toast(res.Header.Message);
              return;
            }
            resolve({
              canPickingWare: res.Body //能否领料
            });
          }
        });
      });
      return myPromise;
    },
    on_returnCount_click(oneItem) {
      // 点击领料区域的退货按钮
      this.returnCountpicking_input = {
        count: oneItem.pickingQty,
        brandName: oneItem.brandName,
        partItemName: oneItem.displayPartsNo,
        pickingStoreHouse: oneItem.storeHouse,
        replenishmentPickingId: oneItem.replenishmentPickingId,
        partItemId: oneItem.partItemId,
        rfqReplyIdTicket: this.query_rfqReplyIdTicket,
        rfqReplyId: this.query_rfqReplyId,
        pickingType: oneItem.replenishmentBillDetailType
      };
      this.returnCountpicking_launched = true;
    },
    on_returnCountModifier_confirm(output) {
      // 确认退领之后需重新拉去领料记录
      this.GetRfqReplenishmentPickingLogs();

      //要遍历所有节点, 更新库存数
      var partItemId = output.partItemId;
      var pickingType = output.pickingType;
      var stockCount = output.stockCount;

      //更新领料区可能的命中商品 车型配件领料组
      var is_picking_group_changed = false;
      this.picking_group.forEach(x => {
        x.dosages.forEach(y => {
          y.partItems.forEach(z => {
            if (z.partItemId == partItemId && z.pickingType == pickingType) {
              is_picking_group_changed = true;
              z.pickingStockCount = stockCount;
            }
          });
        });
      });

      if (is_picking_group_changed) {
        this.picking_group = this.picking_group;
      }

      //更新送货区可能的命中商品 车型配件下单组
      var is_parts_group_changed = false;
      this.parts_group.forEach(x => {
        x.dosages.forEach(y => {
          y.partItems.forEach(z => {
            if (z.partItemId == partItemId && z.pickingType == pickingType) {
              is_parts_group_changed = true;
              z.pickingStockCount = stockCount;
            }
          });
        });
      });
      if (is_parts_group_changed) {
        this.parts_group = this.parts_group;
      }

      //更新通用件可能的命中商品 通用件领料组 领料区
      var is_parts_pickingCommon_changed = false;
      this.pickingCommon_group.forEach(y => {
        y.partItems.forEach(z => {
          if (z.partItemId == partItemId && z.pickingType == pickingType) {
            is_parts_pickingCommon_changed = true;
            z.pickingStockCount = stockCount;
          }
        });
      });

      if (is_parts_pickingCommon_changed) {
        this.pickingCommon_group = this.pickingCommon_group;
      }

      //更新通用件可能的命中商品 普通配件领料组 领料区 [领料清单]
      var is_parts_pickingCategory_changed = false;
      this.pickingCategory_group.forEach(y => {
        y.partItems.forEach(z => {
          if (z.partItemId == partItemId && z.pickingType == pickingType) {
            is_parts_pickingCategory_changed = true;
            z.pickingStockCount = stockCount;
          }
        });
      });

      if (is_parts_pickingCategory_changed) {
        this.pickingCategory_group = this.pickingCategory_group;
      }
    },
    on_onepartitem_launched(e) {
      //伪代码
      //跳转商品页面
      // shopId: this.cloudShopId,
      // partItemId: e.partItemId
    },
    on_countPickingModifier_confirm(e) {
      // 确认领料数量的修改 并且重新渲染数据
      // selectArea 1:领料 2：调货 3:通用件区域 4: 普通配件领料组 【商品清单】
      var modifleCount = e.count;
      var modiflePartItemId = e.partItemId;
      var modiflePickingType = e.pickingType;
      var selectArea = e.selectArea;
      if (selectArea == "1") {
        this.picking_group.forEach(x => {
          x.dosages.forEach(y => {
            y.partItems.forEach(z => {
              if (
                z.partItemId == modiflePartItemId &&
                z.pickingType == modiflePickingType
              ) {
                z.pickingStockCount = z.pickingStockCount - modifleCount;
                z.pickingStatus = 3;
              }
            });
          });
        });
        this.picking_group = this.picking_group;
      } else if (selectArea == "2") {
        this.parts_group.forEach(x => {
          x.dosages.forEach(y => {
            y.partItems.forEach(z => {
              if (
                z.partItemId == modiflePartItemId &&
                z.pickingType == modiflePickingType
              ) {
                z.pickingStockCount = z.pickingStockCount - modifleCount;
                z.pickingStatus = 3;
              }
            });
          });
        });
        this.parts_group = this.parts_group;
      } else if (selectArea == "3") {
        this.pickingCommon_group.forEach(y => {
          y.partItems.forEach(z => {
            if (
              z.partItemId == modiflePartItemId &&
              z.pickingType == modiflePickingType
            ) {
              z.pickingStockCount = z.pickingStockCount - modifleCount;
              z.pickingStatus = 3;
            }
          });
        });
        this.pickingCommon_group = this.pickingCommon_group;
      } else {
        this.pickingCategory_group.forEach(y => {
          y.partItems.forEach(z => {
            if (
              z.partItemId == modiflePartItemId &&
              z.pickingType == modiflePickingType
            ) {
              z.pickingStockCount = z.pickingStockCount - modifleCount;
              z.pickingStatus = 3;
            }
          });
        });
        this.pickingCategory_group = this.pickingCategory_group;
      }
      this.GetRfqReplenishmentPickingLogs();
    },
    on_lookall_record() {
      // 展开收起领料记录列表
      this.isShowAll = !this.isShowAll;
      this.record_text = this.isShowAll ? "收起" : "点击展开全部";
    },
    on_parts_extend() {
      // 点击展开通用件部分 [领料区域]
      this.isOpenParts = true;
    },
    on_parts_extend1() {
      // 点击展开通用件部分 [送货区域]
      this.isOpenParts1 = true;
    },
    on_parts_close() {
      // 点击收起通用件部分 [领料区域]
      this.isOpenParts = false;
    },
    on_parts_close1() {
      // 点击收起通用件部分 [送货区域]
      this.isOpenParts1 = false;
    },
    // 点击立即签收按钮
    on_sign_click() {
      this.signupload_dialog_launched = true;
    },
    on_signupload_both_confirm_click() {
      var _this = this;
      this.signupload_dialog_launched = false;

      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/RfqSignOrder",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          _this.canSign = false;
          _this.orderStatus_text = "已签收";
          Toast("签收成功");
          //启动上传图片
          setTimeout(() => {
            _this.on_upload_click();
          }, 2000);
        }
      });
    },
    on_signupload_onlysign_confirm_click() {
      var _this = this;
      this.signupload_dialog_launched = false;

      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/RfqSignOrder",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId
        },
        success: res => {
          if (res.Header.ErrorCode != 0) {
            Toast(res.Header.Message);
            return;
          }
          _this.canSign = false;
          _this.orderStatus_text = "已签收";
          Toast("签收成功");
        }
      });
    },
    on_signupload_cancel_click() {
      this.signupload_dialog_launched = false;
    },
    goParitem() {
      // 去调货区域
      //0621 伪代码 还待实施
      // $(".hbb-orderingBox").boundingClientRect();
      // query.exec(function(res) {
      //   wx.pageScrollTo({
      //     scrollTop: res[0].top
      //   });
      // });
    },
    lookUploadImg(e) {
      // 0621 伪代码 还待实施
      // // 查看签收图片的大图
      // var oneIndex = e.currentTarget.dataset.index;
      // var request_arr = [];
      // var obj;
      // this.orderImages.forEach(x => {
      //   obj = {
      //     image: x
      //   };
      //   request_arr.push(obj);
      // });
      // var request_obj = {
      //   currentIndex: oneIndex,
      //   bigImg_Arr: request_arr
      // };
      // // 禁止页面滚动
      // this.setData({
      //   isScroll: true,
      //   bigImgSwiper_launched: true,
      //   bigImg_Obj: request_obj
      // });
    },
    delUploadImg(oneIndex) {
      // 点击删除上传签收单的图片
      var that = this;
      MessageBox.confirm("是否确认删除图片").then(action => {
        _this.RemoveRfqReplyCartItem(oneItem.itemKey).then(function(output) {
          that.orderImages.splice(oneIndex, 1);
          that.orderImages = that.orderImages;
          that.ResetOrderImages();
        });
      });
    },
    on_upload_click() {
      let _this = this;
      if (_this.orderImages.length >= 8) {
        Toast("最多可上传8张签收图");
        return false;
      }
      var surplusCount = 8 - _this.orderImages.length;
      // 上传签收图片
      Toast("抱歉, 上传签收单功能尚未开放");

      // 0621 伪代码 还待实施
      // wx.showActionSheet({
      //   itemList: ["从手机相册选择", "拍照"],
      //   success: function(res) {
      //     _this.launched_upload(res.tapIndex, surplusCount);
      //   },
      //   fail: function(err) {
      //     wx.showToast({
      //       title: "取消上传",
      //       icon: "none",
      //       mask: true,
      //       duration: 2000
      //     });
      //   }
      // });
    },
    // launched_upload(tapIndex, surplusCount) {
    //   // 启动上传
    //   let _this = this;
    //   var sourceTypeArr = [];
    //   switch (tapIndex) {
    //     case 0:
    //       sourceTypeArr.push("album");
    //       break;
    //     case 1:
    //       sourceTypeArr.push("camera");
    //       break;
    //     default:
    //       break;
    //   }

    //   wx.chooseImage({
    //     sizeType: ["compressed"], //可选择原图或压缩后的图片
    //     sourceType: sourceTypeArr, //可选择性开放访问相册、相机
    //     count: surplusCount,
    //     success: function(res) {
    //       var tempFilesSize = res.tempFiles[0].size; //获取图片的大小，单位B
    //       if (tempFilesSize <= 5000000) {
    //         //图片小于或者等于2M时 可以执行获取图片
    //         //缓存下
    //         wx.showToast({
    //           title: "正在上传...",
    //           icon: "loading",
    //           mask: true,
    //           duration: 2000,
    //           success: function(ress) {
    //             console.log("成功加载动画");
    //           }
    //         });
    //         console.log(res.tempFilePaths.length, "当前用户选择的张数");

    //         //上传图片总数
    //         _this.current_image_length = res.tempFilePaths.length;

    //         for (var i = 0; i < res.tempFilePaths.length; i++) {
    //           _this.uploadFileFn(res.tempFilePaths[i]);
    //         }
    //       } else {
    //         //图片大于2M，弹出一个提示框
    //         wx.showToast({
    //           title: "上传图片不能大于5M!", //标题
    //           icon: "none" //图标 none不使用图标
    //         });
    //       }
    //     }
    //   });
    // },
    // uploadFileFn(imgUrl) {
    //   // 调取后端接口
    //   var _this = this;
    //   wx.uploadFile({
    //     url: app.globalData.api_domain + "/Rfq/UploadOrderImage",
    //     filePath: imgUrl,
    //     name: "file",
    //     success: function(res) {
    //       var responseData = JSON.parse(res.data);
    //       if (responseData.Header.ErrorCode !== 0) {
    //         wx.showToast({
    //           title: responseData.Header.Message, //标题
    //           icon: "none", //图标 none不使用图标
    //           duration: 2000
    //         });
    //         return;
    //       }
    //       wx.showToast({
    //         title: "上传成功",
    //         icon: "none",
    //         mask: true,
    //         duration: 2000
    //       });
    //       _this.current_image_length--;
    //       _this.orderImages.push(responseData.Body);
    //       _this.setData({
    //         orderImages: _this.orderImages
    //       });
    //       // leg 多张上传我需要知道他是否都上传完 0：已上传完
    //       console.log(_this.current_image_length, "剩余的图片张数");
    //       if (_this.current_image_length == 0) {
    //         _this.ResetOrderImages();
    //       }
    //     },
    //     fail: function(err) {
    //       _this.current_image_length--;
    //       wx.showToast({
    //         title: "上传图片时似乎遇到了点问题,请检查网络设置并重试", //标题
    //         icon: "none", //图标 none不使用图标
    //         duration: 2000
    //       });
    //     }
    //   });
    // },
    ResetOrderImages() {
      // 等全部的图片上传完之后走这个方法  一起签收
      var _this = this;
      this.ajax({
        method: "POST",
        url: resourceUrl + "/Rfq/ResetOrderImages",
        dataType: "JSON",
        data: {
          rfqReplyIdTicket: _this.query_rfqReplyIdTicket,
          rfqReplyId: _this.query_rfqReplyId,
          images: _this.orderImages
        },
        success: res => {}
      });
    },
    on_page_close_click() {},

    //更换变速箱油
    on_transmission_oil_click() {
      var _this = this;
      this.GetAutoAdditionalCommand().then(res => {
        let needSelectTransOilParam = false; //是否需要选车型参数
        let articleId = ""; //文章ID
        res.commands.forEach(item => {
          if (item.command_text == "transmission_oil_change") {
            articleId = item.command_param_1;
            needSelectTransOilParam =
              item.command_param_2.toLowerCase() == "true";
            if (item.command_param_3 != "") {
              _this.transOilParamSelector_params = JSON.parse(
                item.command_param_3
              );
            }
          }
        });
        if (needSelectTransOilParam) {
          this.transOilParamSelector_launched = true;
        } else {
          this.navigateTo({
            url: `${process.env.imDomain}/transmissionOil.html?skip=1&v=${this.vinCode}&tid=${articleId}`
          });
        }
      });
    },

    //取得车型的附加可用指令
    GetAutoAdditionalCommand() {
      var _this = this;
      var myPromise = new Promise(function(resolve) {
        _this.ajax({
          method: "POST",
          url: resourceUrl + "/Auto/GetAutoAdditionalCommand",
          dataType: "JSON",
          data: {
            vinCode: _this.vinCode,
            autoSubId: _this.autoSubId
          },
          success: res => {
            if (res.Header.ErrorCode != 0) {
              Toast(res.Header.Message);
              return;
            }
            resolve(res.Body);
          }
        });
      });
      return myPromise;
    },
    
    on_transOilParamSelector_close() {
      this.transOilParamSelector_launched = false;
    }
  }
};
</script>
<style scoped>
div,
span,
button {
  box-sizing: border-box;
}

span {
  word-break: keep-all;
  word-wrap: break-word;
}

body {
  background: #e4e4e4;
}

.hideScroll {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}

/*页面样式集合*/

.fg-commodityQuotationPage {
  width: 100%;
  /* background: #fff; */
  padding: 0 0 1.32rem;
  float: left;
  clear: left;
}

.fg-commodityQufixed {
  /* overflow: hidden; */
  position: fixed;
  /* z-index: 1;  */
}

.gd-commodityQuotationHead {
  width: 100%;
  background: #fff;
  overflow: visible;
  float: left;
  clear: left;
  position: relative;
  z-index: 20;
}

/*头部杨思调整*/

.gd-topBox {
  width: 10rem;
  height: 1.12rem;
  background-color: #fbc031;
  float: left;
  clear: left;
}

.gd-currentPhone {
  width: 10rem;
  height: 0.8rem;
  background: rgba(0, 0, 0, 0.68);
  padding: 0 .32rem;
  float: left;
  clear: left;
}

.gd-currentPhone>span {
  width: 100%;
  height: .8rem;
  font-size: .32rem;
  letter-spacing: 1px;
  line-height: .8rem;
  text-align: left;
  color: #fff;
  float: left;
  clear: left;
}

/*商家信息*/

.gd-merchantInfo {
  width: 10rem;
  height: auto;
  padding: .11rem .32rem;
  float: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  clear: left;
}

.gd-merchantInfo>span {
  width: auto;
  height: auto;
  max-height: 1.12rem;
  max-width: 5.6rem;
  font-size: .44rem;
  font-weight: bold;
  line-height: 1rem;
  text-align: left;
  color: #222;
  overflow: hidden;
  float: left;
  clear: none;
}

.gd-merchantInfo .spanbox {
  width: auto;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  font-size: .32rem;
  line-height: .45rem;
  text-align: left;
  color: #222;
  float: right;
  clear: none;
}

.gd-merchantInfo .spanbox>span {
  font-size: .34rem;
  text-align: right;
  text-decoration: underline;
}

/* 车型信息入口 */

.gd-carInfoAndEntrance {
  width: 100%;
  height: auto;
  padding: 0;
  background: #fff;
  border-radius: .32rem .32rem 0 0;
  float: left;
  clear: left;
}


.fg-carInfoBox {
  padding: 0 .4rem;
  width: 100%;
  margin: .32rem 0;
  margin-bottom: .28rem;
  float: left;
  clear: left;
}

.fg-carInfoBox>div {
  width: 100%;
  float: left;
  clear: left;
}

.fg-carInfoBox>div>div.dtbox {
  width: 1.28rem;
  height: 1.28rem;
  border: 1px solid #e8e8e8;
  border-radius: .2rem;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.dtbox>img {
  width: 1.28rem;
  height: 1.28rem;
}

.fg-carInfoBox>div>div.ddbox {
  width: 7.6rem;
  height: auto;
  float: right;
  clear: none;
}

.gs-carInfoBox {
  width: 100%;
  height: auto;
  font-size: .36rem;
  line-height: .64rem;
  text-align: left;
  color: #282828;
  float: left;
  clear: left;
}

.gd-entranceBox {
  border: 0;
  padding: .28rem .4rem;
  background: #fffdf5;
  width: 100%;
  display: flex;
  justify-content: space-between;
  float: left;
  clear: left;
}

.gd-entranceBox>div {
  background: #fff;
  width: 2.24rem;
  height: .68rem;
  border: 1px solid #e74c3c;
  border-radius: .48rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.gd-entranceBox>div>span {
  width: auto;
  background: url() no-repeat right center;
  background-size: auto .24rem;
  padding-right: .24rem;
  font-size: .36rem;
  line-height: .48rem;
  text-align: left;
  color: #377de8;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.vinCoda {
  width: auto;
  float: left;
  clear: none;
}

.vinCoda>span {
  width: auto;
  height: auto;
  font-size: .32rem;
  font-weight: normal;
  line-height: .64rem;
  text-align: left;
  color: #666;
  float: left;
  clear: left;
}

.carinfo {
  width: auto;
  height: auto;
  font-size: .32rem;
  font-weight: normal;
  line-height: .64rem;
  text-align: left;
  color: #377de8;
  float: right;
  clear: none;
}

.fg-commodityQuotationFool {
  width: 100%;
  height: 1.32rem;
  background: #fbfcfd;
  border-top: 1px solid #d8d8d8;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 3;
}

.fg-commodityQuotationFool>div {
  width: auto;
  height: .8rem;
  background: #db2f37;
  padding: 0 .4rem;
  border-radius: .07rem;
  font-size: .4rem;
  line-height: .8rem;
  text-align: center;
  color: #fff;
  float: left;
  clear: none;
}

.fg-shopInfo {
  width: 96%;
  background: url() no-repeat left .43rem;
  background-size: auto .48rem;
  padding: .32rem 0;
  padding-left: .6rem;
  float: left;
  clear: left;
  margin-left: 2%;
}

.fg-shopInfo>div {
  width: 7.64rem;
  height: auto;
  min-height: .64rem;
  padding-right: .32rem;
  font-size: .36rem;
  line-height: .64rem;
  text-align: left;
  color: #282828;
  float: left;
  clear: left;
}

.phone {
  width: .96rem;
  height: .64rem;
  border-left: 1px solid #eee;
  padding-left: .32rem;
  float: right;
  clear: none;
}

.fg-consigneeInfo {
  width: 96%;
  border-top: 1px solid #e8e8e8;
  background: url() no-repeat left .46rem;
  background-size: auto .48rem;
  padding: .32rem 0;
  padding-left: .6rem;
  float: left;
  clear: left;
  margin-left: 2%;
}

.fg-consigneeInfo span {
  width: 100%;
  height: auto;
  min-height: .64rem;
  font-size: .36rem;
  line-height: .64rem;
  text-align: left;
  color: #282828;
  padding: 0 .32rem 0 0;
  position: relative;
  word-wrap: break-word;
  word-break: break-all;
  float: left;
  clear: left;
}

.fg-consigneeInfo .address {
  color: #bcbcbc;
}

/*车型详情弹层*/

.fg-carDetails {
  width: 100%;
  height: auto;
  background: #fff;
  border-top: 1px solid #ccc;
  overflow: hidden;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
}

.fg-carDetails-mainBox {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  float: left;
  clear: left;
}

.fg-carDetails-mainBox>div {
  width: 92%;
  padding: .2rem .4rem .2rem 0;
  margin-left: 4%;
  border-bottom: 1px solid #dce6ef;
  box-sizing: border-box;
  float: left;
  clear: left;
}

.fg-carDetails-mainBox>div>span {
  width: 30%;
  padding-right: .32rem;
  font-size: .36rem;
  line-height: .56rem;
  text-align: left;
  color: #999;
  word-wrap: break-word;
  box-sizing: border-box;
  float: left;
  clear: none;
}

.fg-carDetails-mainBox>div>.valuebox {
  width: 70%;
  font-size: .36rem;
  line-height: .56rem;
  text-align: left;
  color: #333;
  word-wrap: break-word;
  box-sizing: border-box;
  float: left;
  clear: none;
}

.gd-commodityQuotationprice {
  background: #ffce00;
  overflow: visible;
  position: relative;
  z-index: 100;
  margin-bottom: .27rem;
}

.gd-commodityQuotationprice .gd-carInfoAndEntrance {
  padding: 0;
  box-shadow: 0 0 .12rem rgba(0, 0, 0, 0.24);
  border-radius: .32rem .32rem 0 0;
}

.gd-commodityQuotationprice .gd-carInfoAndEntrance>div {
  /* padding: 0 .4rem; */
}

/* 订单详情列表样式 */

.fg-detailedListBox {
  width: 100%;
  height: auto;
  float: left;
  clear: left;
  /* border-top: .32rem solid #edf1f6; */
  background: #fff;
  border-radius: .2rem .2rem 0 0;
}

.fg-detailedListBox .pboxtitle {
  width: 100%;
  height: 1.28rem;
  border-bottom: 1px solid #e8e8e8;
  font-size: .4rem;
  line-height: .64rem;
  text-align: center;
  color: #bcbcbc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  float: left;
  clear: left;
}

.fg-detailedListHead {
  width: 92%;
  height: auto;
  margin-left: 4%;
  border-bottom: 1px solid #f3f3f3;
  float: left;
  clear: left;
}

.fg-detailedListHead>div>div {
  height: auto;
  font-size: .32rem;
  line-height: 1rem;
  text-align: right;
  color: #999;
  float: left;
  clear: none;
}

.fg-detailedListHead>div>div.fg-cpmmodityInfo {
  width: 5.6rem;
  text-align: left;
}

.fg-detailedListHead>div>div.fg-cpmmodityNumber {
  width: 1.04rem;
  text-align: center;
}

.fg-detailedListHead>div>div.fg-cpmmodityPrice {
  width: 2rem;
}

/* 商品列表样式 */

.fg-detailedListSeeBody {
  width: 92%;
  margin-left: 4%;
  float: left;
  clear: left;
}

.fg-cpmmodityOne {
  width: 100%;
  height: auto;
  border-bottom: 1px solid #f3f3f3;
  padding: .16rem 0;
  float: left;
  clear: left;
}

.fg-cpmmodityOne>div {
  width: 100%;
  float: left;
  clear: left;
}

.fg-cpmmodityOne>div .dtbox {
  width: 100%;
  height: .48rem;
  font-size: .32rem;
  line-height: .48rem;
  text-align: left;
  color: #181818;
  float: left;
  clear: left;
}


.fg-cpmmodityOne>div .ddbox {
  width: 100%;
  margin-top: .12rem;
  float: left;
  clear: left;
}

.fg-cpmmodityOne>div .ddbox .plxlbox {
  width: 5.6rem;
  margin: 0;
  float: left;
  clear: none;
}

.fp-detailedListSeeBody>div .ddbox .plxlbox {
  width: 5.07rem;
}

.fp-detailedListSeeBody>div .ddbox .plxlboxX {
  width: 5.59rem;
}

.plxlbox>div {
  width: auto;
  display: inline-block;
  float: left;
  clear: none;
}

.gs-brandAndCode {
  width: auto;
  max-width: 100%;
  height: auto;
  margin-right: .2rem;
  font-size: .32rem;
  /* font-weight: bold; */
  line-height: .72rem;
  text-align: left;
  color: #377de8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
  clear: none;
  word-break: break-all;
}

.plxlbox .carinfos {
  width: auto;
  max-width: 100%;
  height: auto;
  margin-right: .2rem;
  font-size: .32rem;
  /* font-weight: bold; */
  line-height: .72rem;
  text-align: left;
  color: #377de8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
  clear: none;
  margin-top: 2px;
}

.fg-numberBox {
  line-height: .72rem;
  text-align: center;
  float: left;
  clear: none;
  /* width: 1.04rem; */
  text-align: center;
  color: #999;
  font-size: .37rem;
}

.ddbox>div.fg-numberBox>span {
  width: 100%;
  text-align: center;
  font-weight: bold;
  color: #377de8;
  font-size: .37rem;
}

.fg-numberBox-clickable {
  /* font-weight: bold; */
  color: #377de8;
}

.fg-priceBox {
  font-size: .37rem;
  line-height: .72rem;
  text-align: right;
  float: right;
  clear: none;
  width: 2rem;
  color: #e74c3c;
}

.ddbox>div.fg-priceBox>span {
  width: 100%;
  font-size: .37rem;
  text-align: center;
  color: #e74c3c;
}

/* 共计样式 */

.fg-commodityQuotationSummary {
  width: 100%;
  height: auto;
  border-top: 1px solid #f3f3f3;
  border-bottom: 1px solid #d8d8d8;
  padding: .2rem 0;
  float: left;
  clear: none;
}

.fg-commodityQuotationSummary>div {
  width: 100%;
  height: auto;
  font-size: .36rem;
  line-height: .64rem;
  text-align: right;
  color: #717171;
  float: right;
  clear: none;
  margin-bottom: .13rem;
}

.fg-commodityQuotationSummary>div text.otherPrice {
  float: right;
  min-width: 1.73rem;
}

.fg-commodityQuotationSummary>div .allprice {
  font-size: .48rem;
  font-weight: bold;
  color: #e74c3c;
  min-width: 1.73rem;
  line-height: .24rem;
}

.fg-detailedListInvalid {
  width: 100%;
  padding: 1.2rem 0 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
  flex-direction: column;
}

.fg-detailedListInvalid text {
  width: 100%;
  background: url(/static/img/icon_invalid.9dd7daf.png) no-repeat center top;
  background-size: 1.6rem;
  padding-top: .85rem;
  font-size: .6rem;
  line-height: .64rem;
  text-align: center;
  color: #bcbcbc;
  float: left;
  clear: left;
}

.ddboxspan .fp-choiceBox {
  width: .6rem;
  height: .72rem;
  background: url() no-repeat left center;
  background-size: .4rem;
  line-height: .72rem;
  text-align: center;
  float: left;
  clear: left;
}

.ddboxspan .fp-choiceSelected {
  background: url() no-repeat left center;
  background-size: .4rem;
}

/*0401添加筛选的样式*/

.fp-checkReminder {
  padding: .2rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.fp-checkReminder .text001 {
  width: auto;
  font-size: .36rem;
  line-height: .8rem;
  text-align: center;
  color: #ffcba9;
  float: left;
  clear: none;
}

.fp-checkReminder .text002 {
  width: .8rem;
  height: .8rem;
  background: url() no-repeat center center;
  background-size: .4rem;
  float: left;
  clear: none;
}

.fp-checkReminder .text003 {
  width: auto;
  font-size: .36rem;
  line-height: .8rem;
  text-align: center;
  color: #ffcba9;
  float: left;
  clear: none;
}

.gb-promotionActivity {
  width: 100%;
  background: #fff;
  padding: 0 .4rem;
  float: left;
  clear: left;
}

.borderYes {
  border-top: .32rem solid #edf1f6;
}

.gb-promotionActivityTitle {
  width: 100%;
  height: .96rem;
  float: left;
  clear: left;
}

.gb-promotionActivityTitle>span {
  width: auto;
  font-size: .36rem;
  line-height: .8rem;
  text-align: center;
  color: #bcbcbc;
  float: left;
  clear: none;
}

.gb-promotionActivityTitle .iconbox {
  width: .8rem;
  height: .8rem;
  background: url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_hot.png) no-repeat center center;
  background-size: .4rem;
  float: left;
  clear: none;
}

.gk-activityBox {
  width: 100%;
  height: auto;
  border: 1px solid #eee;
  border-radius: .08rem;
  padding: .16rem 0;
  background: #fff url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_gesture.gif) no-repeat right bottom;
  background-size: .8rem;
  margin-bottom: .2rem;
  overflow: auto;
  float: left;
  clear: none;
}

.leftbox {
  width: 2.32rem;
  height: 1.68rem;
  padding: .16rem 0 .16rem .08rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.leftbox>div {
  width: 1.6rem;
  height: 1.6rem;
  float: left;
  clear: none;
}

/* 满减 */

.leftbox>div.gk-fullReduction {
  background: url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_fullReduction.gif) no-repeat left 0.16rem;
  background-size: 1.36rem;
}

/*特价 */

.leftbox>div.gh-specialPrice {
  background: url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_specialPrice.gif) no-repeat left 0.16rem;
  background-size: 1.36rem;
}

/* 充抵 */

.leftbox>div.gh-recharge {
  background: url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_deduction.gif) no-repeat left 0.16rem;
  background-size: 1.36rem;
}

/* 买送 */

.leftbox>div.gk-buyAndSend {
  background: url(https://c1.zhipeicloud.com/webresources/miniprogram/images/icon_buyGive.gif) no-repeat left 0.16rem;
  background-size: 1.36rem;
}

.rightbox {
  width: 6.48rem;
  height: 1.68rem;
  padding: .16rem 0;
  float: left;
  clear: none;
}

.rightbox .rightboxp {
  width: 100%;
  font-size: .56rem;
  font-weight: 400;
  line-height: .8rem;
  text-align: left;
  color: #e74c3c;
  float: left;
  clear: none;
}

.rightbox text {
  width: 100%;
  padding-right: .48rem;
  font-size: .36rem;
  line-height: .64rem;
  text-align: left;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
  clear: left;
}

.postionbox {
  width: 100%;
  border-top: .32rem solid #edf1f6;
  border-bottom: .32rem solid #edf1f6;
  float: left;
  clear: left;
}

.gd-brandAuthentication {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  padding-top: 2.32rem;
}

.gd-brandAuthenticationList {
  width: 100%;
  padding: 0 .3rem;
  float: left;
  clear: left;
}

.gd-brandAuthenticationList>div {
  width: 1.68rem;
  height: 2rem;
  margin: .1rem;
  background: #fff;
  border-radius: .08rem;
  border: 1px solid #eee;
  padding-top: .24rem;
  overflow: hidden;
  float: left;
  clear: none;
}

.gd-brandAuthenticationList>div>span {
  width: 100%;
  height: auto;
  font-size: .28rem;
  line-height: .48rem;
  text-align: center;
  color: #333;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
  clear: left;
}

.gd-brandAuthenticationList>div>div {
  width: 100%;
  height: .96rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.gd-brandAuthenticationList>div>div>img {
  /* width: auto;
  height: auto; */
  max-width: 1.28rem;
  max-height: 1.28rem;
}

/* 完善地址 */

.aa-confirmInfoPop {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.68);
  position: fixed;
  left: 0;
  top: 0;
  z-index: 300;
}

.aa-confirmInfoPopBox {
  width: 100%;
  height: auto;
  background: #fcfcfc;
  float: left;
  clear: left;
}

.aa-confirmInfoPopBox>span {
  width: 100%;
  height: auto;
  padding: 0 .4rem;
  background: #fcfcfc;
  border-bottom: 1px solid #eee;
  font-size: .32rem;
  line-height: .8rem;
  text-align: left;
  color: #e74c3c;
  float: left;
  clear: left;
}

.aa-confirmInfoMain {
  width: 100%;
  height: auto;
  padding: .28rem .4rem;
  background: #fff;
  border-bottom: 1px solid #eee;
  float: left;
  clear: left;
}

.aa-confirmInfoMain>span {
  width: 1.2rem;
  height: .8rem;
  font-size: .37rem;
  line-height: .8rem;
  text-align: left;
  color: #888;
  float: left;
  clear: left;
}

.aa-confirmInfoMain>input {
  width: 8rem;
  height: .8rem;
  border: 0;
  font-size: .37rem;
  line-height: .8rem;
  text-align: left;
  color: #282828;
  float: left;
  clear: none;
}

.aa-addMain {
  width: 6.4rem;
  height: auto;
  min-height: .8rem;
  max-height: 1.6rem;
  border: 0;
  font-size: .37rem;
  line-height: .8rem;
  text-align: left;
  color: #282828;
  float: left;
  clear: none;
}

.aa-addPlaceholder {
  margin: .24rem 0 0;
  font-size: .32rem;
  color: #bcbcbc;
  display: block;
}

.aa-confirmInfoMain>div {
  width: auto;
  height: auto;
  border: 0;
  margin-left: .32rem;
  font-size: .32rem;
  line-height: .8rem;
  text-align: left;
  color: #0b85f5;
  float: left;
  clear: none;
}

.aa-confirmInfoButton {
  width: 100%;
  padding: .32rem 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  float: left;
  clear: left;
}

.aa-confirmInfoButton>div {
  width: 3.2rem;
  height: .96rem;
  border: 1px solid #e74c3c;
  border-radius: .48rem;
  background: #fff;
  font-size: .48rem;
  line-height: .93rem;
  text-align: center;
  color: #e74c3c;
  float: left;
  clear: none;
}

.aa-confirmInfoButton>div.aa-ignoreButton {
  border: 1px solid #d8d8d8;
  color: #999;
}

.giftimg {
  width: 1.49rem;
  height: .64rem;
  margin: .05rem .04rem;
  float: left;
  clear: none;
}

/* 活动列表 */

.gh-eventsListMain {
  width: 100%;
  /* padding: 0 .4rem .4rem .4rem; */
  float: left;
  clear: left;
}

.singleActivity {
  width: 9.2rem;
  margin-bottom: .4rem;
  border: 1px solid #eee;
  border-radius: .08rem;
  position: relative;
  float: left;
  clear: none;
}

.singleActivity>img {
  width: .8rem;
  height: .72rem;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.singleActivity_box {
  width: 100%;
  position: relative;
  z-index: 1;
  float: left;
  clear: left;
}

.singleActivity_box_left {
  width: 1.44rem;
  height: 1.44rem;
  margin-top: .16rem;
  margin-right: .2rem;
  margin-bottom: .16rem;
  float: left;
  clear: left;
  margin-left: .4rem;
}

.singleActivity_box_left>img {
  width: 100%;
  height: 100%;
  float: left;
  clear: left;
}

.singleActivity_box_right {
  width: 6.48rem;
  float: left;
  clear: none;
  margin-top: .13rem;
  margin-left: .4rem;
}

.singleActivity_box_right>span {
  width: 100%;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
}

.singleActivity_box_right>span.text1 {
  font-size: .56rem;
  line-height: .8rem;
  color: #e74c3c;
}

.singleActivity_box_right>span.text2 {
  padding-right: .48rem;
  font-size: .36rem;
  line-height: .6rem;
  color: #999;
}

.activlogin {
  width: 100%;
  height: auto;
  padding-top: 6.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.activlogin>div::after {
  border: none;
}

.activlogin>div {
  width: 4.27rem;
  height: 1.28rem;
  border: 1px solid #e74c3c;
  font-size: .48rem;
  line-break: 1.04rem;
  text-align: center;
  color: #e74c3c;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.redPacketLabel {
  width: .88rem;
  height: .72rem;
  margin: -.03rem .04rem .05rem;
  float: left;
  clear: none;
}

.fg-buttonFool {
  width: 100%;
  background: #FF7E29;
  display: flex;
  justify-content: center;
  align-items: center;
  /* position: fixed;
  bottom: 0;
  left: 0; */
  /* z-index: 3; */
  height: 1.6rem;

}

/* .fg-buttonFool>div {
  width: 4rem;
  height: .8rem;
  background: #e74c3c;
  border-radius: .08rem;
  border: none;
  font-size: .4rem;
  line-height: .8rem;
  text-align: center;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 3;
  float: right;
  clear: none;
  margin-bottom: .27rem;
} */


.fg-buttonFool>div::after {
  border: 0;
}

.fg-maskBox {
  width: 100%;
  height: auto;
  /* background: rgba(0,0,0,0.48); */
  position: fixed;
  bottom: 0;
  left: 0;
  top: 0;
  z-index: 1;
}

.fg-guidelinesPic {
  width: 8.56rem;
  height: 6.64rem;
  position: absolute;
  bottom: .12rem;
  left: .72rem;
  z-index: 1;
}

.fg-guidelinesPic>img {
  width: 8.56rem;
  height: 6.64rem;
}

.fg-gesturePic {
  width: 1.12rem;
  height: 1.12rem;
  position: absolute;
  top: .64rem;
  right: 2.35rem;
  z-index: 6;
}

.fg-gesturePic>img {
  width: 1.12rem;
  height: 1.12rem;
}

.fg-buttonFool .fg-closeButton {
  width: .8rem;
  height: .8rem;
  position: absolute;
  bottom: 6.08rem;
  right: .9rem;
  z-index: 6;
}

/* 0724新增已采购金额模块 */
.gr-commodityQuotationPage {
  padding: 0 0 2.29rem;
}

.gr-purchaseAmount {
  width: 100%;
  height: 1rem;
  background: #FFFBEB;
  border-top: 1px solid #FFE7C2;
  border-bottom: 1px solid #FFE7C2;
  padding: 0 .4rem;
  position: fixed;
  bottom: 1.31rem;
  left: 0;
  z-index: 2;
}

.gr-purchaseAmountIcon {
  width: .37rem;
  height: .4rem;
  margin: .28rem 0;
  float: left;
  clear: none;
}

.gr-purchaseAmountTitle {
  width: auto;
  padding: .11rem 0 0;
  margin-left: .24rem;
  font-size: .32rem;
  line-height: .85rem;
  text-align: left;
  color: #282828;
  float: left;
  clear: none;
}

.gr-purchaseAmountRmb {
  width: auto;
  padding: .11rem .08rem 0 0;
  font-size: .32rem;
  line-height: .85rem;
  text-align: left;
  color: #FF301A;
  float: left;
  clear: none;
}

.gr-purchaseAmountPrice {
  width: auto;
  font-size: .48rem;
  font-weight: bold;
  line-height: .96rem;
  text-align: left;
  color: #FF301A;
  float: left;
  clear: none;
}

.gr-purchaseAmountLink {
  width: .16rem;
  height: .24rem;
  margin: .36rem 0;
  float: right;
  clear: none;
}



/* 2019.08.02 查看报价单-分组查看及增加系列展示 */
.gs-carAccessoriesBox {
  width: 100%;
  border-top: 1px solid #d8d8d8;
  margin-top: -1px;
  float: left;
  clear: left;
}

.gs-carAccessoriesNoBox {
  width: 100%;
  border-top: 1px solid #d8d8d8;
  margin-top: -1px;
  float: left;
  clear: left;
}

.gs-customizeBox {
  width: 100%;
  border-top: 1px solid #d8d8d8;
  margin-top: -1px;
  float: left;
  clear: left;
}

.gs-groupingTitleBox {
  width: 100%;
  height: auto;
  padding: .16rem 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.gs-groupingTitleBox>img {
  width: .48rem !important;
  height: .16rem !important;
  float: left;
  clear: none;
}

.gs-groupingTitleBox>div {
  width: auto !important;
  height: .64rem;
  padding: 0 .24rem;
  font-size: .4rem;
  line-height: .64rem;
  text-align: center;
  color: #181818;
  display: block;
  float: left;
  clear: none;
}

.plxlbox>div.gs-labelSeries {
  width: auto;
  min-width: .64rem;
  /* height: .4rem; */
  margin: .16rem .21rem .18rem 0;
  padding: 0 .08rem;
  border-radius: .21rem .08rem .21rem .08rem;
  background: #F39C12;
  font-size: .28rem;
  line-height: .4rem;
  text-align: center;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.plxlbox>div.gs-otherCode {
  width: 100%;
  height: auto;
  font-size: .32rem;
  line-height: .72rem;
  text-align: left;
  color: #F39C12;
  float: left;
  clear: left;
  word-wrap: break-word;
  word-break: break-all;
}

.gs-brandName {
  color: #333;
}

.fg-buttonBox {
  width: 4.08rem;
  height: .61rem;
  position: relative;
  float: left;
  clear: none;

}

.fg-buttonBox img {
  width: 4.08rem;
  height: .88rem;
  float: left;
  clear: left;
}

.fg-buttonBox div {
  width: auto;
  height: .8rem;
  font-size: .37rem;
  line-height: .8rem;
  text-align: center;
  color: #FF1B44;
  box-sizing: border-box;
  border-radius: 10px;
  overflow: hidden;
  background-color: #F8F8F8;
}

.fg-buttonBox-orig div {
  background: none;
  color: #FFF;
  border: 1px solid #fff;
  box-sizing: border-box;
}

.fg-buttonBox-miniclose {
  width: auto;
  height: .8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: .4rem;
}

.fg-buttonBox-miniclose div {
  width: auto;
  height: .8rem;
  font-size: .48rem;
  line-height: .8rem;
  text-align: center;
  color: #FFF;
  box-sizing: border-box;
  background-color: #FF7E29;
}


/* 赠品展示 */
.gs-giftListBox {
  width: 100%;
  float: left;
  clear: left;
}

.gs-brandText {
  font-size: .32rem;
}

.gs-giftListBox .gs-groupingTitleBox {
  width: 100%;
  height: .64rem;
  margin: .12rem 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.gs-giftListBox .gs-groupingTitleBox img {
  width: 3.39rem;
  height: .4rem;
}

.gs-giftListBox .fg-cpmmodityOne>div .ddbox .plxlbox {
  width: 4.8rem;
}

/* 0903 新增备注展示 */
.gf-quoteRemarksBox {
  width: 100%;
  background: #fff;
  /* border-top: .32rem solid #EDF1F6; */
  padding: 0 .4rem;
  float: left;
  clear: left;
  border-radius: 0 0 .2rem .2rem;
}

.gf-quoteRemarksTitle {
  width: 100%;
  height: auto;
  font-size: .32rem;
  line-height: 1rem;
  background-color: #fff;
  padding: 0 .48rem;
  text-align: left;
  float: left;
  clear: left;
  display: flex;
  align-items: center;
}

.RemarksBoxs {
  float: left;
  width: 1.33rem;
  color: #C1C1C1;
}

.gf-quoteRemarksMain {
  float: left;
  width: calc(100% - 1.33rem);
  padding: .13rem 0;
  color: #656565;
}

.gf-quoteRemarksMain>div {
  width: 100%;
  height: auto;
  border: 0;
  resize: none;
  font-size: .32rem;
  line-height: .56rem;
  text-align: justify;
  color: #282828;
  float: left;
  clear: left;
}

.fg-detailedListNoCommodity {
  display: flex;
  width: 100%;
  justify-content: center;
}

.gs-outOfStockLabel {
  width: auto;
  max-width: 100%;
  height: auto;
  margin-right: .2rem;
  font-size: .32rem;
  font-weight: bold;
  line-height: .72rem;
  text-align: left;
  color: #e74c3c;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  float: left;
  clear: none;
}

.gs-outOfStock {
  color: #bcbcbc;
}

.Adaptation {
  font-size: .32rem;
  color: #e74c3c;
}

.Adaptation-red {
  color: #e74c3c;
}

/* 10.30 */
/* 操作指导相关 */
.ha-guidePicBox {
  display: flex;
  width: 100%;
  background: #f8f8f8;
  flex-direction: column;
  padding: 0 .24rem .24rem;
  margin-top: .27rem;
}

.ha-guidePicName {
  width: 100%;
  font-size: .32rem;
  line-height: .56rem;
  text-align: left;
  color: #838383;
  margin: .16rem 0 .08rem;
  float: left;
  clear: left;
}

.ha-guidePicMainBox {
  width: 100%;
  max-width: 8.72rem;
  height: auto;
  position: relative;
  float: left;
  clear: left;
}

.ha-singlePic {
  width: 1.84rem;
  height: 1.84rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 0 .08rem;
  background: #fff;
}

.ha-singlePic img {
  width: 100%;
  height: 100%
}


/*scroll-view外层*/
.skill-sequence-panel-content-wrapper {
  position: relative;
  /* height: 55px; */
  white-space: nowrap;
  overflow-x: hidden;
}

/*左右渐变遮罩*/
/*scroll-view本身*/
.skill-sequence-panel-content {
  min-width: 100%;
}

/*scroll-view内层*/
.skill-sequence-skill-wrapper {
  margin-left: 2px;
  display: inline-block;
}

/*设置空白以保持美观*/

.skill-sequence-panel-content .skill-sequence-skill-wrapper:last-child {
  margin-right: 16px;
}

.ha-categoryTitle {
  width: 100%;
  display: flex;
  justify-content: space-start;
  align-items: center;
}

.ha-categoryTitle .ha-leftBox {
  width: auto;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  /* padding-right: .64rem; */
}

/* 品类名称的展示 */
.ha-categoryTitleText {
  width: auto;
  font-size: .4rem;
  line-height: .64rem;
  text-align: left;
  color: #333;
}

/* 参考用量的展示 */
.ha-referenceDosage {
  width: auto;
  padding: 0 0 0 .16rem;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.ha-referenceDosage img {
  width: .08rem;
  height: .13rem;
  position: relative;
  z-index: 2;
}

.ha-referenceDosage div {
  width: auto;
  border-radius: .08rem;
  border: 1px solid #FF5E08;
  margin-left: -1px;
  padding: 0 .12rem;
  font-size: .32rem;
  line-height: .4rem;
  text-align: left;
  color: #FF5E08;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 5.6rem;

}

/* 右侧选规格按钮的样式 */
.ha-categoryTitle .ha-rightBox {
  width: 1.84rem;
  height: .64rem;
  position: relative;
  float: left;
}

.ha-rightBox img {
  width: 100%;
  height: .64rem;
}

.ha-buttonText {
  width: 1.64rem;
  height: .64rem;
  font-size: .37rem;
  line-height: .64rem;
  text-align: center;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

/* 选规格 */
.ha-changeName {
  width: 100%;
  padding-top: .08rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  float: left;
}

.ha-changeName img {
  margin-left: .16rem;
  width: .64rem;
  height: .64rem;
}

.ha-changeDecoration {
  width: .08rem;
  height: .32rem;
  background: #FF5E08;
  border-radius: .04rem;
  display: block;
  margin-right: .16rem;
}

.ha-changeNameText {
  font-size: .32rem;
  line-height: .48rem;
  text-align: left;
  color: #E20000;
  font-weight: bold;
}

.hb-baozhuang {
  border: 1px solid #9914D1;
  border-radius: .11rem;
  color: #9914D1;
  line-height: .48rem !important;
  font-size: .32rem !important;
  padding: 0 .2rem;
  margin-top: .11rem;

}

.hbb-oneAllPrice {
  font-size: .27rem;
  margin-top: -.2rem;
}

/* 20200413 铺货领料改版 */
.hbb-pickingBox {
  display: flex;
  width: 100%;
  margin-top: 1.87rem;
  background: #f5f7fa;
  flex-direction: column;
  border-radius: .27rem;
  padding: .27rem;
}

.hbb-pickingBox .title {
  display: flex;
  width: 100%;
  justify-content: center;
  letter-spacing: .07rem;
  color: #333;
  height: .8rem;
}

.hbb-pickingBox .title div {
  width: 5.68rem;
  height: 100%;
}

.hbb-pickingBox .title div img {
  width: 100%;
  height: .47rem;
  margin-top: .13rem;
}

.hbb-pickingBox .content {
  display: flex;
  width: 100%;
  background: #fff;
  flex-direction: column;
  padding: 0 16px;
  border-radius: .27rem;
  margin-top: .27rem;
  overflow: hidden;
}

.hbb-pickingBox .content1 {
  padding: 0;
}

.hbb-pickingBox .content .list {
  float: left;
  width: 100%;
  margin-top: .27rem;
}

.hbb-pickingBox .content .top {
  display: flex;
  width: 100%;

}

.hbb-pickingBox .content .list span {
  float: left;
  width: auto;
  line-height: .27rem;
  color: #666666;
  margin-right: .27rem;
  font-size: .32rem;
}

.hbb-pickingBox .content .list div {
  float: left;
  font-size: .36rem;
  text-align: center;
}

.hbb-pickingBox .content .list div.hbb-nextPick {
  background: none;
  border: 1px solid #e74c3c;
  color: #e74c3c;
}

.hbb-pickingBox .content .fg-detailedListHead div {
  color: #bcbcbc;
}

.hbb-pickingBox .content .contentBox {
  padding: 0 .21rem .21rem .27rem;
}

.hbb-pickingBox .content .contentBox .list {
  margin-top: .27rem;
  padding-left: 1.5%;
}

.hbb-pickingBox .content .list .cpmmodityInfo {
  width: 5.6rem;
  text-align: left;
  color: #5b5b5b;
  line-height: .64rem;
}

.hbb-pickingBox .content .list .cpmmodityInfo span {
  float: none;
  color: #4084EA;
  padding: 0;
  margin: 0 .16rem;
  display: inline-block;
}

.hbb-pickingBox .fg-cpmmodityPrice {
  text-align: right;
}

.hbb-pickingBox .content .list .pickingNumber {
  width: 1.04rem;
  color: #717171;
}

.hbb-pickingBox .content .list .pickingData {
  width: 2rem;
  color: #bcbcbb;
  text-align: right;
}

.hbb-pickingBox .content .list span.a {
  margin-top: .27rem;
}

.hbb-pickingBox .content .list span.b {
  color: #333;
}

.hbb-pickingBox .content .list span.c {
  float: none;
  color: #e74c3c;
  font-weight: bold;
  margin-right: 0;
}

.hbb-pickingBox .content1 .top {
  display: flex;
  width: 100%;
  height: .93rem;
  align-items: center;
  background: #FFFAE6;
  padding: 0 .21rem 0 .27rem;
  font-size: .4rem;
  color: #5b5b5b;
  line-height: .64rem;
}


.hbb-orderingBox {
  display: flex;
  width: 100%;
  margin-top: .27rem;
  padding: .27rem .27rem 0;
  background: #FF7E29;
  flex-direction: column;
  border-radius: .27rem;
}

.hbb-pickingTitle {
  display: flex;
  width: 100%;
  align-items: center;
  margin-bottom: .13rem;
  justify-content: space-between;
  color: #fff;
  height: .93rem;
}

.hbb-pickingTitle span {
  font-size: .4rem;
  font-weight: bold;
}

.gf-quoteRemarksBoxNoNeed {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 55;
}

.fg-buttonFool .fg-buttonBox {
  margin-bottom: .27rem;
}

.ha-rightBox1 {
  position: relative;
  width: 1.84rem !important;
  float: right;
}

.hbb-pickingBox .ha-referenceDosage {
  margin-top: -.13rem;
  margin-right: .13rem;
}

.hbb-none {
  display: none;
}

.hbb-pickingTitleCenter {
  justify-content: space-between;
  padding: 0 .27rem;
}

.hbb-pickingTitleCenter .text1 {
  font-size: .32rem;
}

.hb-pickingStockCount {
  font-size: .32rem;
  color: #282828;
  /* margin-right: .16rem; */
  /* font-weight: bold; */
  float: left;
  width: auto;
}

.hb-pickingStockCount span {
  color: #e74c3c;
  /* font-weight: bold; */
}

.hbb-pickingBox .ha-rightBox {
  width: 2.27rem;
}

.hbb-pickingBox .ha-buttonText {
  width: 100%;
}

.ha-buttonText1 {
  border: 1px solid #e74c3c;
  border-radius: .4rem;
}

.ha-buttonText1 span {
  color: #e74c3c;
  font-size: .32rem;
}

.hbb-pickingBox .fg-cpmmodityOne {
  padding: .27rem 0;
  border-bottom: 0;
}

/* .hbb-pickingBox .gs-brandAndCode {
  line-height: .64rem;
}

.hbb-pickingBox .gs-brandName,
.hbb-pickingBox .gs-brandAndCode {
  color: #5b5b5b;
  font-size: .36rem;
  text-overflow: auto;
  white-space: normal;
} */

.hb-pickingStockCount1 {
  float: left;
  width: auto;
  margin-top: .08rem;
}

.hbb-otherBox {
  float: left;
  width: 100%;
  height: auto;
}

.hbb-orderingBoxP {
  padding-bottom: 0;
}

.hbb-lookAllBox {
  display: flex;
  width: 100%;
  padding: .9rem 0 .27rem;
  margin-top: -.64rem;
  background-image: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 0) 100%);
}

.hbb-lookAllBoxNone {
  background-image: none;
}

.hbb-lookAll {
  display: flex;
  width: 90%;
  border: 2px solid #e74c3c;
  color: #e74c3c;
  font-size: .4rem;
  justify-content: center;
  align-items: center;
  border-radius: .67rem;
  padding: .2rem 0;
  font-weight: bold;
  margin: 0 auto;
}

.contentHeightMin {
  height: 2.8rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.contentHeightAuto {
  height: auto;
  padding-bottom: .53rem !important;
}

.hbb-pickgrounp {
  border-top: 1px solid #e8e8e8;
  padding: .24rem 0;

}

.hbb-pickgrounpNone {
  border: 0;
}

.hbb-tui {
  border: .03rem solid #e74c3c;
  color: #e74c3c !important;
  border-radius: .11rem;
  text-align: center;
  padding: .03rem .11rem;
  display: inline-block;
  width: auto;
  float: none !important;
}

.hbb-tyButton {
  display: flex;
  width: 100%;
  padding: .77rem 0 .27rem;
  position: relative;
  border-radius: .4rem;
  overflow: hidden;
  margin: .27rem 0;
}

.hbb-tyButtonbg {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;

}

.hbb-tyButtontxt {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(to right, #FF4B70 0%, #F60000 100%);
  font-size: .37rem;
  color: #fff;
  height: 100%;
}

.hbb-tyButtontxt1 {
  background: none;
  color: #e74c3c;
  border: .03rem solid #e74c3c;
  border-radius: .4rem;
}

.hbb-carInfo {
  float: left;
  width: 100%;
}

.hbb-headerB {
  display: flex;
  width: 100%;
}

.hb-nopickingBox {
  display: flex;
  width: 100% !important;
  justify-content: center;
  align-items: center;

}

.hb-nopicking {
  width: auto;
  align-items: center;
  display: flex;
  font-weight: bold;
  font-size: .4rem;
}

.hb-goQian {
  width: auto !important;
  padding: .03rem .27rem;
  background: #fff;
  border-radius: .27rem;
  font-size: .32rem;
  display: flex;
  align-items: center;
  margin-left: .13rem;
  height: .67rem !important;
  color: #377de8;
}

.hbb-pickingBox .title div.hb-nopicking {
  width: auto !important;
}

.hb-nopickingBox img {
  width: .32rem !important;
  margin-right: .2rem;
  height: .29rem !important;
  margin-top: .05rem !important;
}

.hb-klBox {
  float: left;

}

.hb-klBox .hb-pickingStockCount {
  float: none !important;
}

.hb-klBox1 {
  width: 1.04rem;
  text-align: center;
  color: #282828;
  height: .64rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hb-klBox1 .hb-pickingStockCount span {
  color: #282828 !important;
}

.hb-klBox2 {
  width: 2rem;
  text-align: right;
  height: .64rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}


.hbb-signBox {
  display: flex;
  width: 100%;
  margin: .27rem 0;
  margin-bottom: 0 !important;
}

.hbb-signImgBox {
  float: left;
  width: 100%;
  margin-bottom: .27rem;
}

.hbb-signImgBox .img {
  float: left;
  width: 2rem;
  height: 2rem;
  border: 1px solid #ddd;
  margin-left: .2rem;
  margin-top: .2rem;
  position: relative;
  border-radius: .16rem;
  overflow: hidden;
}

.hbb-signImgBox .imgNone {
  margin-left: 0 !important;
}

.hbb-signImgBox .img img {
  position: absolute;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.hbb-signImgBox .img span {
  width: .4rem;
  height: .4rem;
  background: #e74c3c;
  color: #fff;
  font-size: .28rem;
  line-height: .4rem;
  position: absolute;
  text-align: center;
  border-radius: .08rem;
  right: 0;
  top: 0;
  z-index: 2;
}

.pickingDatah {
  display: flex;
  width: 100%;
  height: .67rem;
  justify-content: center;
  align-items: center;
  font-size: .27rem;
  color: #bcbcbb;
  margin-bottom: .13rem;
}

.hbb-timeGrounp {
  margin: .07rem 0;
  line-height: .64rem;
}

.fg-detailedListHead1 {
  margin-left: 0;
  width: 100%;
  border-bottom: 0;
  margin-bottom: -.27rem;
}

.pickingDataColor {
  color: #181818 !important;
}

.fg-picking-bottomarea {
  width: 100%;
  height: 1.28rem;
  margin-bottom: -.27rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.fg-picking-bottomarea-closebutton {
  width: auto;
  height: .8rem;
}

.fg-picking-bottomarea-closebutton div {
  width: auto;
  height: .8rem;
  padding: 0 .8rem;
  border: 1px solid #fff;
  background: #fff;
  border-radius: .4rem;
  font-size: .4rem;
  line-height: .64rem;
  text-align: center;
  color: #e74c3c;
  display: flex;
  justify-content: center;
  align-items: center;
}



.fg-signupload-Pop {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.68);
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30;
}

.fg-signupload-PopBox {
  width: 72%;
  height: auto;
  background: #fff;
  border-radius: .08rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  float: left;
  clear: left;
}

.fg-signupload-Box {
  width: 100%;
  height: auto;
  float: left;
  clear: left;
}

.fg-signupload-Title {
  width: 100%;
  height: auto;
  padding: .48rem 0 .43rem;
  font-size: .4rem;
  line-height: .64rem;
  text-align: center;
  color: #333;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  float: left;
  clear: left;
}

.fg-signupload-Both {
  width: 100%;
  height: 1.33rem;
  border-top: 1px solid #d8d8d8;
  font-size: .48rem;
  font-weight: 700;
  line-height: .8rem;
  text-align: center;
  color: #377DE8;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.fg-signupload-OnlySign {
  width: 100%;
  height: 1.33rem;
  border-top: 1px solid #d8d8d8;
  font-size: .37rem;
  line-height: .64rem;
  text-align: center;
  color: #377DE8;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.fg-signupload-Main {
  width: 100%;
  height: .8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: left;
}

.fg-signupload-Main>div {
  width: .8rem;
  height: .8rem;
  display: block;
  border: 1px solid #d8d8d8;
  color: #999;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
  clear: none;
}

.fg-signupload-Main>div.reduceButton {
  border-radius: .08rem 0 0 .08rem;
}

.fg-signupload-Main>div.plusButton {
  border-radius: 0 .08rem .08rem 0;
}

.fg-signupload-Main>div.iconButtonDisable {
  background: #fafafa;
  color: #e8e8e8;
}

.fg-signupload-Main>div.fg-signupload-Input {
  width: 1.2rem;
  border-left: 0;
  border-right: 0;
}

.fg-signupload-Main>div.fg-signupload-Input>span {
  width: 1.2rem;
  height: .77rem;
  border: 0;
  font-size: .4rem;
  line-height: .77rem;
  text-align: center;
  color: #282828;
  float: left;
  clear: none;
}

.fg-signupload-Button {
  width: 100%;
  height: auto;
  border-top: 1px solid #d8d8d8;
  float: left;
  clear: left;
}

.fg-signupload-Button>div {
  width: 100%;
  height: auto;
  background: none;
  float: left;
  clear: none;
}

.fg-signupload-Button>div>div {
  width: 100%;
  height: auto;
  font-size: .43rem;
  line-height: 1.04rem;
  text-align: center;
  color: #377DE8;
  background: none;
  float: left;
  clear: left;
}

.fg-signupload-Button>div>div::after {
  border: 0;
  border-radius: 0;
}

.fg-signupload-Button>div.cancelButton {
  border-right: 1px solid #ddd;
}

.fg-signupload-Button>div.cancelButton>div {
  color: #999;
}

.sdw-dosage-hint {
  width: auto;
  height: .72rem;
  background-color: rgba(0, 0, 0, 0.68);
  border-radius: .08rem;
  padding: 0 .24rem;
  margin: -.04rem 0 -.04rem .16rem;
  font-size: .32rem;
  line-height: .48rem;
  list-style: none;
  color: #fff;
  display: flex;
  justify-content: flex-start;
  align-items: center;

}


.sdw-dosage-hint div {
  display: inline-block;
  margin: 0 .16rem;
}

.sdw-dosage-hint div span {
  font-size: .4rem;
  font-weight: 700;
  color: #ff0;
  display: inline-block;
}

.sdw-dosage-hint img {
  width: .4rem;
  height: .4rem;
}


.ha-guidePicBox-view {
  display: flex;
  align-items: center;
  height: 2.36rem;
  width: 100%;
  padding-top: .12rem;
  background-color: #f3f3f3;
  padding: .16rem;
  padding-left: 0;
  border-radius: .13rem;
}

.ha-guidePicBox-view .label {
  width: 2.67rem;
  height: 100%;
  background-color: #f3f3f3;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: .32rem;
}

.ha-guidePicBox-view .sdw-content {
  flex: 1;
  display: flex;
  background: #fff;
  height: 100%;
  align-items: center;
}

.ha-guidePicBox-view .operateImages {
  width: 1.6rem;
  height: 1.6rem;
  margin-left: .32rem;
}

.ha-guidePicBox-view .seeDetail-view {
  background-color: #e74c3c;
  color: #fff;
  font-size: .28rem;
  padding: .08rem .16rem;
  border-radius: .08rem;
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  margin-left: .4rem;
}

.ha-guidePicBox-view .seeDetail-view .button_right_arrow {
  width: .08rem;
  height: .12rem;
  margin-left: .05rem;
}

</style>
